解决跨域问题

昧光V

已于 2022-05-17 21:45:37 修改

阅读量237

点赞数

分类专栏： vue 文章标签：前端 javascript

于 2021-12-06 15:11:28 首次发布

本文链接：https://blog.csdn.net/qq_1212/article/details/121747466

版权

本文介绍了浏览器的同源策略以及由此引发的跨域问题。针对跨域，文章提到了三种解决方案：JSONP（需要服务端配合，已不太流行）、CORS（实际业务中常用，需服务端配置）和Vue、uniapp开发阶段常用的proxy代理。详细阐述了proxy在vue.config.js中的配置方法，适用于开发环境的跨域请求。

摘要由CSDN通过智能技术生成

在发送请求后,看到以下错误提示,先确认接口地址是否正确,如果确定是正确,由于浏览器跨域了

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5pin5YWJVg==,size_20,color_FFFFFF,t_70,g_se,x_16

跨域的问题是由于浏览器的同源策略 .同源策略是浏览器的基本安全策略.目的是为了更加安全.

同源: 协议,主机[域名,IP],端口都一致才可以.

解决方案:

jsonp 需要服务端配置返回数据并进行回调操作不太流行了
cors 在服务端配置运行跨域实际公司业务采用的一种方式要求服务端配合
proxy 开发过程中使用上线也可以用基于开发者服务器进行配置转发请求

常见跨域场景:

URL 说明是否允许通信
http://www.domain.com/a.js
http://www.domain.com/b.js 同一域名，不同文件或路径允许
http://www.domain.com/lab/c.js

http://www.domain.com:8000/a.js
http://www.domain.com/b.js 同一域名，不同端口不允许

http://www.domain.com/a.js
https://www.domain.com/b.js 同一域名，不同协议不允许

http://www.domain.com/a.js
http://192.168.4.12/b.js 域名和域名对应相同ip 不允许

http://www.domain.com/a.js
http://x.domain.com/b.js 主域相同，子域不同不允许
http://domain.com/c.js