reactjs在创建错误和XMLHttpRequest.handleError时出现网络错误

Question

我正在创建一个应用程序，以reactjs为前端，以rails API为后端。我的前端在端口3000上运行，而导轨在3001上运行。我为此设置了代理服务器。我向铁轨提出要求。这是我登录用户的发帖请求。请注意，我正在发出https请求，因为应该将后端设置为处理该请求：

axios.post('https://localhost:3001/api/login/authentication', {
  email: email,
  password: password
})
.then(response => {
  this.props.history.push('/Main')
})
.catch(error => {
  console.log(error)
})

运行此命令时，出现以下错误：

Error: Network Error at createError (createError.js:17) at XMLHttpRequest.handleError (xhr.js:87)

有人可以帮我解决这个问题吗？

Answer 1

即使两个应用程序共享相同的基本URL，它们仍在不同的端口上运行，这足以使浏览器将它们视为两个不同的来源。

在这种情况下，您应该在后端应用程序中启用跨源资源共享（CORS）机制。

有关CORS here的更多信息。