bladex前端反向代理(解決跨域)


1.vue.config.js

module.exports = {
  //路徑前綴
  publicPath: "/",
  lintOnSave: true,
  productionSourceMap: false,
  chainWebpack: (config) => {
    //忽略的打包文件
    config.externals({
      'vue': 'Vue',
      'vue-router': 'VueRouter',
      'vuex': 'Vuex',
      'axios': 'axios',
      'element-ui': 'ELEMENT',
    });
    const entry = config.entry('app');
    entry.add('babel-polyfill').end();
    entry.add('classlist-polyfill').end();
    entry.add('@/mock').end();
  },
  devServer: {
    port: 1888,
    proxy: {
      '/api': {
        //本地服務接口地址
        target: 'http://localhost',
        //遠程演示服務地址,可用於直接啟動項目
        //target: 'https://saber.bladex.vip/api',
        ws: true,
        pathRewrite: {
          '^/api': '/'
        }
      }
    }
  }
};

對所以請求都加上“api”,反向代理(大概這個意思),實際上去訪問的target的url“http://localhost”,同時去掉“api”,這個是80端口,瀏覽器並不知道這一件事情,

比如:http://localhost:1888/api/blade-subway/test/list?current=1&size=10,這個請求,通過devServer轉發,其實訪問的http://localhost/blade-subway/test/list?current=1&size=10

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM