时间戳

首页 > 解决方案 > 如何在 vue-cli 中使用 proxyTable 进行跨源请求？

vue.js - 如何在 vue-cli 中使用 proxyTable 进行跨源请求？

问题描述

我想在我的 vue-cli 项目中将 proxyTable 与 axios 一起使用。

在我的config/index.js中，我输入了这样的代码：

proxyTable: {
  '/getnews': {
    target: 'https://xx.xxx.xx.x'
    changeOrigin: true,
    secure: false,
    pathRewrite: {
      '^/getnews': '/getnews'
    }
  }
}

在我的请求函数中，它是这样的：

var url = '/getnews';
  this.$axios({
    methods: 'get',
    url: url,
  })
  .then(response => {
    console.log(response);
  })

现在问题来了，我的浏览器控制台告诉我

xhr.js?ec6c:178 GET http://localhost:8080/getnews 504（网关超时）

终端说：

尝试将请求 /getnews 从 localhost:8080 代理到https://xx.xxx.xx.x时发生错误（ECONNREFUSED）

所以看起来代理不起作用，我的请求仍然发送到我的本地主机。任何人都知道如何解决这个问题？

标签： vue.jswebpackvue-cli-3

解决方案

在朋友的帮助下，我终于弄清楚了。导致问题的原因是缺少端口号。代码应该是这样的：

proxyTable: {
  '/getnews': {
    target: 'https://xx.xxx.xx.x:8080'
    changeOrigin: true,
    secure: false,
    pathRewrite: {
      '^/getnews': '/getnews'
    }
  }
}

然后它工作得很好。

推荐阅读