前端学习笔记

文章目录

  • 1、学习路线
  • 2、token的安全储存方案
  • 3、跨域
  • 4、相关的学习链接

前言:最近在学习前端补齐我的软件技能树,最近简单总结一下

1、学习路线

基本:vue3、ts(js)、 vite、eslint、css(动画、布局)

依赖包:vue-router、vue-i18n、store(pinio)、axios、ui组件(elementPlus、Angular、Ant Design)

网络相关: cookie/session/token/storage

架构: 微前端、缓存架构

学习脉络是找个成熟的系统,你就按照自己的思路去实现一遍,然后对比思考总结

2、token的安全储存方案

cookie:

将token存储在cookie中是一种常见的做法。这种方式的优点是,即使在浏览器关闭后,cookie仍然存在,因此用户可以保持登录状态。然而,cookie的缺点是容易受到CSRF(跨站请求伪造)攻击。

localstorage:

将token存储在localStorage中的优点是,即使在浏览器关闭后,localStorage中的数据仍然存在,因此用户可以保持登录状态。此外,localStorage中的数据可以在同一浏览器的所有标签页和窗口中共享。然而,localStorage的缺点是容易受到XSS(跨站脚本)攻击。

sessionstorage:

将token存储在sessionStorage中的优点是,它只在当前会话中存在,当用户关闭浏览器后,sessionStorage中的数据将被清除。这种方式的缺点是,如果用户在浏览器中打开新的标签页或窗口,那么新的页面将无法访问sessionStorage中的数据

总的来说,将token存储在哪里取决于你的应用需求。如果你的应用需要在用户关闭浏览器后保持登录状态,那么你可以选择将token存储在cookie或localStorage中。如果你的应用需要在用户关闭浏览器后清除token,那么你可以选择将token存储在sessionStorage中。

3、跨域

3.1 response的Header设置了set-Cookie参数为什么没有生效?

需要设置以下cookie的参数类型:

onlyHttp: false

Secure: false

如果后台指定了domain,那么需要跟当前访问的域名是一样的, 而且127.0.0.1跟localhost也是不一样的

4、相关的学习链接

  • vue3入门-菜鸟教程

  • vite官方中文文档

  • element组件

  • eslint中文文档

  • Cookie 后端在Response中addCookie无效(请求中已有Set-Cookie)

  • token 应该存在 Cookie、SessionStorage 还是 LocalStorage 中?

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/487983.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mysql第五章 在线测试_PHP+MySQL来实现在线测试quiz功能

在上一篇文章中,我们介绍了jQuery前端PHP在线测试题效果。这篇文章将结合实例给大家介绍如何使用jQueryPHPMySQL来实现在线测试题,包括动态读取题目,答题完毕后台评分,并返回答题结果。查看演示下载资源:1332次 下载资…

深度揭秘AI换脸原理,为啥最先进分类器也认不出?

文章来源:VentureBeat,arXiv智东西4月20日消息,AI换脸已不是新鲜事,手机应用市场中有多款换脸app,此前也曾曝出有网络IP用明星的面孔伪造色情影片、在大选期间用竞选者的脸制作虚假影像信息等。为了规避Deepfake滥用带…

ASP.NET MVC中在 @RenderBody() 或者 @Html.Partial()中需要使用引入外部js,css

今天想在后台封装一下bootstraptree这个插件,引入jquery.js bootstrap.js bootstrap.css bootstrap-tree.js后,我在页面查看脚本错误就连最简单的 $(function(){ alert("test"); }) 经过一番查看,原来mvc在生成_layout的时候默认先…

用ubuntu远程连接mysql_Ubuntu 安装 MySQL 和远程连接

#安装MySQLsudo apt install mysql-server#进入数据库sudo mysql#修改密码ALTER USER rootlocalhost IDENTIFIED WITH mysql_native_password BY 123;产生用户不能授权的原因是mysql 数据库中user 表中的特定用户(root) 的host 的属性值为localhost.#查看select host, user fro…

中美德工业互联网路径比较

转自丨无锡情报所作者丨王喜文,九三学社中央促进技术创新工作委员会委员、九三学社中央科技委委员过去20年,互联网是改变社会、改变商业最重要的技术;如今,随着5G、物联网以及云计算和大数据、区块链、人工智能技术的迅速发展&…

不同浏览器隐藏默认表单样式

各种appearance: none; 转载于:https://www.cnblogs.com/haimingpro/p/7168738.html

jmeter file upload 变量_通达OA上传漏洞之变量覆盖分析

作者:kw0ng开始通达OA上传到包含漏洞分析的文章已经有很多,本文重点分析,文件上传处决定路径信息是否回显的UPLOAD_MODE参数是怎么传递的。代码分析触发文件上传点位于/ispirit/im/upload.php中,服务端在接收文件信息的同时还需要…

如果卷积神经网络存在根本性的缺陷,你会怎么看?

来源:人工智能头条作者 | Ben Dickson译者 | 香槟超新星经过一段漫长时期的沉寂之后,人工智能正在进入一个蓬勃发展的新时期,这主要得益于深度学习和人工神经网络近年来取得的长足发展。更准确地说,人们对深度学习产生的新的兴趣在…

cacls查看文件权限

PS C:\> cacls .\099260b8-7e81-4d4c-8970-c637011399bf.txt C:\099260b8-7e81-4d4c-8970-c637011399bf.txt BUILTIN\Administrators:(ID)FNT AUTHORITY\SYSTEM:(ID)FBUILTIN\Users:(ID)R F 表示完全控制C 表示更改W 表示写入R 表示读取借钱享受 祸患无穷http://v.youku.…

python语法基础整理_Python基础

Python是一种计算机编程语言。计算机编程语言和我们日常使用的自然语言有所不同,最大的区别就是,自然语言在不同的语境下有不同的理解,而计算机要根据编程语言执行任务,就必须保证编程语言写出的程序决不能有歧义,所以…

产业|嵌入式传感器将是未来机器人等技术增长的核心

来源:EEWORLD移动即服务(MaaS)被认为是智能移动的一个关键要素,而机器人汽车技术将是智能移动的一个重要因素,它又高度依赖于嵌入式传感器。根据市场研究和战略咨询公司Yole development pement (Yole)的预测,在这种情况下&#x…

vscode写java没有提示_VS Code报错Language Support for Java(TM)插件显示需要JDK11 写java代码没有提示...

鉴于IDEA的打开速度(电脑的垃圾),平常刷LeetCode都是在VSCode上,结果这几天老是打开给我报错Java 11 or more recent is required to run. Please download and install a recent JDK由于平常开发一直需要使用Java8,将环境变量改为JDK11是绝对…

1.6.2 多表插入

1.6.2 多表插入正在更新内容,请稍后 转载于:https://www.cnblogs.com/cxchanpin/p/7182943.html

可观测宇宙中,我们可能是唯一的生命

图片来源:Pixabay长期以来,人类一直渴望在宇宙中找到地外生命的痕迹,但一项于今年早些时候发表的研究,给持有此类想法的人泼了一盆冷水。基于“自然发生”学说以及其中的“RNA世界”假说,研究人员认为在可观测宇宙中&a…

MySQL占用系统进程_MySQL的Sleep进程占用大量连接解决方法

第一部分为产生大量sleep进程的原理及对应解决方法第二部分为设置wait_timeout值,有效减少sleep进程第一部分开始1、通常来说,MySQL出现大量Sleep进程是因为采用的PHP的MySQL长链接数据库方式,即使用了mysql_pconnect来打开链接数据库&#x…

中国工程院发布“中国电子信息工程科技发展十六大挑战”

来源:通信世界全媒体通信世界网消息(CWW)为响应中央决策部署,推进我国新型数字基础设施建设,推动我国电子信息工程科技领域高质量发展,助力数字基建科学发展驱动壮大经济新动能。4月26日,中国工程院信息与电子学部、中…

Unix下5种I/O模型

Unix下I/O模型主要分为5种: (1)阻塞式I/O (2)非阻塞式I/O (3)I/O复用(select和poll) (4)信号驱动式I/O (5)异步I/O 1、阻塞式I/O模型 unix基本的套…

2019年智能科学与产业综述论文盘点

来源:计算机研究与发展2019年综述论文盘点1.智能芯片的评述和展望(韩栋,周聖元,支天,陈云霁,陈天石)2.闪存存储的重构与系统构建技术(陆游游,杨者,舒继武)3.基于动态权衡的新型非易失存储器件体系结构研究综述&#xf…

h命令可以获取mysql客户端的帮助信息_如何获取MySQL帮助信息

在开发或测试环境在碰到MySQL相关故障时,大多数朋友可能会通过论坛发帖,QQ群讨论方式来获取帮助。该方式是获取帮助的有效途径之一。然而如果在生产环境,在没有网络的环境下,这些方式就无助于问题的解决。无论何种数据库&#xff…

PageObjects 设计模式

什么是Page Objects(翻译为:页面对象?)… 简单的说,Page Objects是指UI界面上用于与用户进行交互的对象。它可以指整个页面,也可以指Page上的某个区域。Page Objects是你的test code的交互对象,是对实际UI的一种抽象模…