【uniapp】uniapp 跨域解决

1.服务端设置CORS

在后端的响应头设置Access-Control-Allow-Origin属性，允许前端的访问：

Access-Control-Allow-Origin: *

2.在HBuilder编辑器中使用内置浏览器运行

使用hbuildex X 编辑器运行到内置浏览器无需考虑跨域问题。

3. （打包上线需配置nginx）配置代理服务器，在根目录下创建vue.config.js并在里面配置代理（vue2版本）

module.exports = {
   
   
	devServer: {
   
   
		disableHostCheck: true,
		proxy: {
   
   
			"/h5api": {
   
   
				target: "https://tiyu.baidu.com",
				changeOrigin: true,
				secure: false,
				pathRewrite: {
   
   
					"^/h5api": "/"
				}
			}
		}
	}
}

配置完后，使用uni.request发起网络请求无需https://tiyu.baidu.com
假设完整请求路径如下： https://tiyu.baidu.com/posts
此时发请求如下即可：

uni.request({
   
   
	url:"/h5api/posts"  //这里的/h5api相当于设置的target目标地址
}).then(res=>{
   
   
	console.log(res);
})

由于配置了vue.config.js,在微信小程序运行并不适用（微信小程序不存在跨域）。所以需要根据平台判断所属环境，来改变url的路径即可