跨域和前端安全一.跨域协议域名端口号有一个不一致就是跨域 1.如何解决跨域 JSONP 就是使用一些不受浏览器同源策略

一.跨域

协议域名端口号有一个不一致就是跨域

JSONP 就是使用一些不受浏览器同源策略限制的标签，<img><script><link><iframe> 比如将请求的url放在src中向后端发送请求
- 函数是前端写的，通过<script>给后端一个接口帮我们调用。
- 优点：兼容性高，不需要XMLHttpRequest,轻量简单
- 缺点：只能发get请求不能发post请求，当发生异常前端无法监听，存在被恶意注入脚本的风险
CORS 在后端中设置响应头中的字段Access-Control-Allow-Origin设置允许哪些域名访问服务器
- 主流的解决跨域的手段，可以发送所有的请求类型
跨域代理通过代理服务器，跳过同源策略的限制在服务器和服务器间发送请求，可以在vue，react的脚手架中设置代理
- 正向代理：前端对客户端进行代理
- 反向代理：对服务端进行代理，通过nginx将后端接口代理到代理到网站地址
- Nginx统一配置客户端访问的服务器add_header:Access-Control-Allow-Origin
postMessage H5提供的API，主要用于框架间的通信
WebSocket:基于TCP协议，使用于实时性较高的场景

这是一种代码注入的攻击方式，攻击者通过在网络上注入恶意脚本来获取用户的相关信息，如cookie，监听用户行为，生成页面广告等

XSS分为三种

存储型XSS
- 将XSS代码发送到服务器数据库，在前端发送请求时将XSS发送给前端,来获取cookie等信息，常出现在与数据库有关联的功能中，如用户私信，商品评论等
反射型XSS - 将XSS代码恶意脚本放在URL中经过服务器返回到客户端与HTMl一起执行解析，常出现在与url有关的功能上，如网站搜索，点击链接跳转等
文档型XSS
- 这种XSS不会经过服务端，而是在在数据的传输过程中获取到数据包,然后修改里面的HTML文档这种的XSS攻击方式属于前端的漏洞问题，因为恶意脚本的取出和执行都在客户端完成，前面那两种是服务端的安全漏洞

防范XSS的方式

利用cookie会在同源请求发送时携带给服务端的特性来冒充用户。一般是在一个第三方网站上，在进入其网站时向被攻击网站发送跨站请求，利用获取到的cookie通过服务器的验证，冒充用户执行某些操作

防范CSRF

对请求来源的站点进行验证
对cookie的sameSite进行设置
- strict:浏览器完全拒绝第三方请求携带cookie,只有在相同域名网站下可以发送
- lax:相对strict宽松，但也只能在get提交表单和a标签发送get请求的情况下可以携带cookie
- none:cookie的sameSite的默认值，即发送请求会自动携带cookie
利用token,后端生成一个token，前端在每次请求发送时都要携带token与后端的进行校验

将恶意的sql语句放在form表单或者请求参数中，被发送给后端，在后台sql服务器中解析执行

防范SQL注入 利用web防火墙，在服务端做安全检查

攻击方同时与服务端和客户端建立起链接，并让对方都认为连接是安全的，实际上整个会话期间的内容都被攻击者所控制

防范HTTPS中间人