uniapp/vue h5跨域问题解决_vue跨域返回的是h5

导言：是否有很多前端小伙伴都被跨域这个问题搞得晕头转向，我也是，下面给大家献上3种解决方法（关闭浏览器，vue代理域名，uniapp代理域名）

一、关闭谷歌浏览器跨域（简单粗暴）

在桌面找到谷歌浏览器图标---->右键---->属性---->快捷方式----> 目标

这里我的谷歌浏览器地址是：

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"
1

需要在后面加上一句话：

 --disable-web-security --user-data-dir=C:\Program Files (x86)\Google\Chrome\Application
1

注意：–disable-web-security… 最前面是有个 空格 的千万别忘了哦

最后结果：

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir=C:\Program Files (x86)\Google\Chrome\Application
1

最后操作：关闭当前谷歌浏览器，重新双击点开

出现这样的界面，恭喜你已经成功关闭跨域，可以快乐的撸代码了O(∩_∩)O哈哈~

二、vue的跨域解决（设置代理域名）

在根目录下找到 vue.config.js 这个js文件，如果没有就自己创建一个，复制如下代码：

const path = require("path");
module.exports = {
	devServer: {
		port: "8998", //dev运行的端口
		host: 'localhost', //本地运行的ip
		open: true, //项目启动时是否自动打开浏览器，我这里设置为false,不打开，true表示打开
		proxy: {
			'/': { //代理的地址如果 是 / 请求地址就不用带 如果是 /api， 请求地址则是 /api + 接口url
				"target" : "http://xx.xxx.xx.x:1008",//请求的api地址
				"changeOrigin" : true,
				"secure" : false
			},
		},
		historyApiFallback: true,
		disableHostCheck: true,
		noInfo: true,
		https: false
	}
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

然后关闭项目重新 run 一遍，恭喜你，又可以快乐的撸代码了

uniapp的跨域解决（设置代理域名）

在manifest.json文件中 找到 h5 复制如下代码：

"h5" : {
        "title" : "测试",
        "domain" : "localhost",
        "devServer": {
        	"port": "8998", //dev运行的端口
        	"host": "localhost", //本地运行的ip
        	"open": true, //项目启动时是否自动打开浏览器，我这里设置为false,不打开，true表示打开
        	"proxy": {
        		"/": { //代理的地址如果 是 / 请求地址就不用带 如果是 /api， 请求地址则是 /api + 接口url
        			"target" : "http://39.109.13.1:1004",//请求的api地址
        			"changeOrigin" : true,
        			"secure" : false
        		}
        	},
        	"historyApiFallback": true,
        	"disableHostCheck": true,
        	"noInfo": true,
        	"https": false
        },
        "router" : {}
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

然后关闭项目重新 运行 一遍，恭喜你，又又可以快乐的撸代码了