14.vue 网络请求跨域解决方案

JS采取的是同源策略

同源策略是浏览器的一项安全策略，浏览器只允许js 代码请求和当前所在服务器域名,端口,协议相同的数据接口上的数据,这就是同源策略.

也就是说，当协议、域名、端口任意一个不相同时，都会产生跨域问题，所以又应该如何解决跨域问题呢

跨域错误提示信息

目前主流的跨域解决方案有两种：

1. 后台解决：cors

2. 前台解决：proxy

//vue.config.js
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    proxy: {
      '/api': {
        target: 'http://XXXXX.com',
        changeOrigin: true
      }
    }
  }
})

温馨提示

解决完跨域配置之后，要记得重启服务器才行哦！