vue 解決跨域問題

vue 解決跨域

首先需要配置vue.config.js

devServer: {
    open: true, // 啟動服務后是否打開瀏覽器
    host: '0.0.0.0',
    port: 8086, // 服務端口
    https: false,
    hotOnly: false,
    proxy: {
      '/api': {
        target: 'http://39.99.202.206:8090',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    },
    before: app => { }
  },

重點就是proxy中的配置，配置好之后可以直接使用/api 代替域名

這里使用的是axios 因此直接配置給默認的url，如下：

配置了默認的請求地址，調接口可以直接使用(不懂axios的請自學)

請求的地址雖然還是localhost但是已經代理成了請求的地址