vue项目里如何配置本地代理实现跨域请求

1、在如图项目配置的index.js文件夹下添加以下一段话

微信图片_20180912182204.png
proxyTable: {
      '/rest': {
        target: 'http://192.168.20.223:8080', <!--此处是需要代理的IP地址-->
        pathRewrite: {
          "^/rest": '/rest'   <!--调取后端接口时,代理识别的头部,rest只是一个自定义识别头部名称,可以自行随意取-->
        },
        // secure: false, <!--https需要配置的参数-->
        changeOrigin: true  <!--接口跨域需要配置的参数-->
      }
    },

代码中的rest只是在请求接口时本人自定义的一个名称,当发起请求的时候,服务器会识别到路径里的/rest,将/rest替换成我们所配置的如:‘http://192.168.20.223:8080’代理ip地址,从而实现跨域请求。

2、代码提交后,必须执行npm run dev 重启一下项目

配完代理,就可以轻松的实现本地的跨域请求了,以上配置不支持公共环境跨域请求,如果需要公共环境跨域请求的话,需要在nginx上配置代理

3、下面给一个如何用配好代理请求后端地址的列子

let url = "/rest/robot/case/caseList?page=1&size=25";<!-- 在后端给的请求地址前面加上代理约定好的头“/rest”-->
let param = {}
this.$http.post(url,param)
.then(result => {
      if (result.data.success) {                       
      } else {                        
      }                  
})
.catch(error => {
    console.log(error)
 });




最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,067评论 19 139
  • Spring Web MVC Spring Web MVC 是包含在 Spring 框架中的 Web 框架,建立于...
    Hsinwong阅读 22,604评论 1 92
  • 我殷切的希望爱情都是唯美的, 在这唯美的年纪, 刚好与最美的你相遇。
    燕荡山上阅读 68评论 0 1
  • 麻麻小米想逛街淘点货,姐姐红豆、弟弟松子随同。天气的反常,阳光指数直逼夏日,东南方的11月中下旬仍穿着短袖破洞裤出...
    小米粥里的一条虫阅读 345评论 0 1
  • 昨天下午放学爸爸来接我和妈妈还有弟弟回老家去,在回老家的路上,妈妈买很多的 鸡腿,妈妈刚把鸡腿拿上车,我就以为是熟...
    荣耀健身器材阅读 152评论 0 0