前言
跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号(如存在)相同,则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源,不能访问和操作其他域下的资源,主要是安全问题。
在很多时候跨域问题我都是让后端解决,嘿嘿。但也有需要自己解决的项目!
-
首先在项目的根目录下建一个vue.config.js
-
如下:
//改变webpack的设置 const { default: Axios } = require("axios") module.exports = { publicPath :"./", devServer: { // 设置主机地址 // host: 'xxx.1xx.1xx.xxx', // // 设置默认端口 // port: 8051, // 设置代理 proxy: { '/api': { // 目标 API 地址 target: 'http://xxx.xxx.xxx.xxx:8051',//服务器地址 // 如果要代理 websockets ws: true, // 将主机标头的原点更改为目标URL changeOrigin: false } } }, chainWebpack: config => {//没有用到scss的这里就不需要啦! const oneOfsMap = config.module.rule('scss').oneOfs.store oneOfsMap.forEach(item => { item .use('sass-resources-loader') .loader('sass-resources-loader') .options({ // 要公用的scss的路径 resources: './src/assets/base.scss' }) .end() }) } }
授道解惑?10行代码 1行注释,2行括号,3行废话,4行bug !