本文主要是介绍[亲测有效]一键解决困扰已久的VUE-CORS前端跨域问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
[亲测有效]
一键解决困扰已久的VUE-CORS前端跨域问题
- 找到config/index.js
设置proxyTable，实际上就是设置代理路径，设置config文件之后，需要重新npm run dev或者npm run serve
源码：
module.exports = {devServer: {host: 'localhost',port: 8081,autoOpenBrowser: true,assetsSubDirectory: 'static',assetsPublicPath: '/',proxyTable: {'/api': {target: 'http://localhost:8089',// 要跨域的域名changeOrigin: true, // 是否开启跨域pathRewrite: {'^/api': '/'}},},},
}
- 新建一个封装axios的文件，如 src/api/index.js
代码：
import axios from 'axios';const instance = axios.create({timeout: 10000,headers: {'Content-Type': "application/json;charset=utf-8"}
});export default {userLogin ( data ) {return instance.post('/api/user/login', data);},};- 在main.js中引用并且暴露出来：
import instanceImport from './api/index';Vue.prototype.instance = instanceImport
这篇关于[亲测有效]一键解决困扰已久的VUE-CORS前端跨域问题的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
