详解vue或uni-app的跨域问题解决方案

最新推荐文章于 2024-09-23 16:41:36 发布

莫比乌斯的日落

最新推荐文章于 2024-09-23 16:41:36 发布

阅读量1.1k

点赞数

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

本文链接：https://blog.csdn.net/aliyun3/article/details/125325060

版权

本文详细介绍了Vue.js和Uni-App在处理跨域问题时的两种常见解决方案：服务器端配置和客户端代理。服务器端可以通过设置中间件允许跨域，而客户端可以利用代理欺骗浏览器实现跨域请求。重点讲解了Vue CLI和Uni-App的代理配置，包括`target`、`pathRewrite`、`changeOrigin`等关键参数的用法。

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

常见解决方案有两种

服务器端解决方案

服务器告诉浏览器：你允许我跨域

具体如何告诉浏览器，请看：

// 告诉浏览器，只允许 http://bb.aaa.com:9000 这个源请求服务器
$response->header('Access-Control-Allow-Origin', 'http://bb.aaa.com:9000');
// 告诉浏览器，请求头里只允许有这些内容
$response->header('Access-Control-Allow-Headers', 'Authorization, Content-Type, Depth, User-Agent, X-File-Size, X-Requested-With, X-Requested-By, If-Modified-Since, X-File-Name, X-File-Type, Cache-Control, Origin');
// 告诉浏览器，只允许暴露'Authorization, authenticated'这两个字段
$response->header('Access-Control-Expose-Headers', 'Authorization, authenticated');
// 告诉浏览器，只允许GET, POST, PATCH, PUT, OPTIONS方法跨域请求
$response->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, OPTIONS');
// 预检
$response->header('Access-Control-Max