uniapp在解决谷歌浏览器跨域问题,在谷歌浏览器运行 红太狼 2021-08-27 16:55 1562阅读 0赞 最近在写一个uniapp项目 但是app无法在谷歌浏览器上运行 运行就报错 后来看了报错信息,是跨域问题, ![跨域图片][20200403145755856.png] 于是就使用了官方推荐的HBuilderX的内置浏览器,说实话用久了还觉得蛮方便的,主要是我是单屏幕,总是来回切换会十分的不方便,但是我还是十分的想要解决这个跨域问题,好啦,废话不多说,上代码~~~ 1. 在manifest.json的源码视图里,使用代理服务器的方式 "h5" : { "router" : { "mode" : "hash" }, "devServer" : { "https" : false, // "port": 8000, //端口号 // "disableHostCheck": true, "proxy" : { "/api" : { "target" : "http://www.XXX.XXXX.XXXXX666.com", //这里是你的目标接口域名 "changeOrigin" : true, //是否跨域 "secure" : false, // 设置支持https协议的代理 "pathRewrite" : { "^/api" : "/" } }, "/formalAPI" : { "target" : "http://www.XXXXX.com/", "changeOrigin" : true, //是否跨域 "secure" : false, // 设置支持https协议的代理 "pathRewrite" : { "^/formalAPI" : "/" } } } } } 2.上面我写了两个代理 是因为我有一个测试环境和一个正式环境 我懒得每回改所以就写了两个API代理 因为是封装的requeset请求 所以需要在封装的请求里面写上我们代理的域名 Https.js页面 const process= 'development'; var baseURL = '/api'; if(process === 'development'){ console.log('开发环境/测试环境') // baseURL = '/api'; }else{ console.log('生产环境/正式环境') baseURL = '/formalAPI'; } 3.同理如果你在main.js页面设置了全局的baseURL也是一样的 Vue.prototype.baseUrl = '/api'; 4.设置完以后要重启整个项目 然后运行到谷歌浏览器啦 跨域问题就解决啦 最后上一张图吧 ![接口成功调用][20200403162410738.png] 对了最后再说一下需要注意的地方: **注意:当我使用代理服务器在谷歌浏览器上运行的时候,再使用真机调试,就会报错,无法识别/api,所以最后还是使用了内置的浏览器。** [20200403145755856.png]: /images/20210813/bdccd9a29128432a901a043c194edfdc.png [20200403162410738.png]: /images/20210813/9ddd8c2c66704ea997e7222c1d4d9526.png
还没有评论,来说两句吧...