前端处理跨域

最新推荐文章于 2024-06-12 11:13:48 发布

devnotbug

最新推荐文章于 2024-06-12 11:13:48 发布

阅读量316

点赞数 5

文章标签：前端

本文链接：https://blog.csdn.net/qq_52602294/article/details/138389656

版权

1、出现跨域的原因

同源策略是浏览器提供的一种安全机制，可以防止跨站脚本攻击；
同源策略：协议（http / https）、域名 / IP 地址、端口号，一致就是同源，不一致就是不同源；

2、JSONP 利用的不是xhr请求，利用的script标签的src可以跨域，请求接口资源，同时携带一个callback回调函数名字，将数字传给回调函数，解决get不能解决post

cors: 后端开启

vue.config.js
// 192.168.13:8081/login
// /api/login
devServer: {
	proxy: {
		'/api': {
			target: '接口url地址'
      pathRewrite: '重写'
        }
	}
}

3、nginx 反向代理

在 nginx 服务器 nginx.com 配置文件

server {
        listen       8083;# 监听的端口
        server_name  localhost; #监听的主机名 也可以是域名或者ip地址

        location ~ /api/ {            
            proxy_pass http://localhost:8084;
        }   
				location ~ /prod/ {           
            proxy_pass http://localhost:8085;
        }
}