vue2.0解决跨域问题，vue3.0解决跨域问题_vue2代理不会跨域vue3会

首先我简单的谈谈自己对跨域的一个理解：

简单的来说就是当前的网址和你需要请求数据的网址不一样，具体怎么不一样，可以概括为几点：首先是一个http和https不一样，这是协议不一样，属于跨域，然后访问的端口号不一样，也是属于跨域，还有就是例如：http://www.baidu.com和http://www.baidu.com/index.html这两个就不是属于跨域，因为他们有相同的端口、请求协议、域名。

vue2.0的解决办法：
需要修改的文件为 webpack.base.conf.js
文件目录如下图：

module.exports = {
	// 配置转发代理  webpack.base.conf.js
	devServer: {
	  disableHostCheck: true,
	  port: 8080,
	  proxy: {
	    '/api': {
	      target: '192.168.1.111：8601',
	      ws: true,
	      pathRewrite: {
	        '^/api': '/api'
	      }
	    }
	  }
	}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

注意文件位置就行port可以不用改

vue3.0的解决办法

在src文件夹下面新建vue.config.js
内容为：

module.exports = {
    devServer: {
        proxy: {
            '^/api': {
                target: 'http://192.168.200.199:8601',
                changeOrigin: true
            }
        }
    }
}
1
2
3
4
5
6
7
8
9
10

^/api指的是访问路径为指定的网址后面接着的部分只要是/api都可以访问，发送请求
这里需要注意的是target后面的就是需要请求的网址。