使用webpack配置vue项目代理 (超简单)

  咱们都知道,前端开发跨域是一个很常见的问题,固然跨域的方法也有不少,如今我就给你们分享一个在vue项目中如何使用webpack作代理,步骤简单,操做方便,本人亲测,巨好使😆html

  首先,找到你的config文件夹,打开index.js前端

  找到dev下面的 proxyTable vue

 

    proxyTable: {webpack

    '/api': {web

            target: 'http://172.00.61.243:8082', // 你接口的域名  http://172.00.61.243:8082api

            //secure: false,      // 若是是https接口,须要配置这个参数跨域

            changeOrigin: true,     // 若是接口跨域,须要进行这个参数配置测试

            pathRewrite: {this

              '^/api': ''spa

            }

        }

   },

  

  接着去你的index.html入口文件里面设置代理头  

 

  const IS_DEBUG = true; //若是是测试环境就是true,若是是生产环境就是false

const commonUrl = IS_DEBUG ? '' : 'http://172.00.61.243:8082';

 

  以后就能够去页面中作请求了

  

  this.$http.get(commonUrl + '/api/getLocations').then(response => {

// console.log(response);

}, response => {

alert(response);

});

 

  分享完毕😆

相关文章
相关标签/搜索