Question

我正在尝试通过使用axios在HTTPS上运行的react（使用redux）前端outlook add-id发出请求。我想在package.json中使用代理设置，所以我只需要在我的请求中使用/ path / to / endpoint，但是后端运行在http上，而两者都在本地主机上，似乎axios不使用代理设置并且不会重定向到非https端点。我已经尝试通过https运行后端，将请求发送到安全的heroku服务器，我实际上托管了运行https的后端，添加了axios-proxy-fix软件包，但似乎没有任何工作。所以我当前的设置如下（删除了不相关的代码）： package.json文件：

{
  ...
  "dependencies": {...}, 
  "proxy": "http://localhost:5000"
}

我的authActions.js文件，我发出请求：

export const signupUser = (userData) => dispatch {
  axios.post('/auth/user/signup', userData)
       .then(...)
       .catch(...);
};

然后我收到此错误：＆＃34;无法加载资源：服务器响应状态为400（HTTP / 2.0 400）https://localhost:3000/auth/user/signup＆＃34;。

我原本希望路径为http://localhost:5000/auth/user/signup，因为那是代理指定的地方，也就是我的后端运行的地方。但是，它正在尝试访问端口3000 ...这是前端通过https运行的端口。

有没有人有任何建议？我唯一的另一个想法是尝试没有axios，因为fetch可以使用代理设置吗？

Answer 1

开发服务器只会尝试不发送请求在其代理的Accept标头中的text / html。

...来自here。

你是否有机会包括那个标题？

Answer 2

经过一番搜索，我找到了一个三步解决方案。

首先，我必须使用命令HTTPS = true npm run server（服务器是我的脚本名称）通过https运行dev服务器。

其次，我必须在package.json文件中指定我想要一个安全代理，如下所示：

"proxy": {
"secure": true,
"target": {
  "host": "https://localhost",
  "port": 5000
  }
}

最后，我更改了我的ajax请求以使用fetch而不是axios。

我希望如果他们发现自己处于类似情况，这会有所帮助。

Answer 3

对于遇到此问题的其他人。另一种可能的解决方案是：

检查以确保您使用的是 React 应用程序文件夹中的 package.json，而不是服务器文件夹中的。

第二个可能的问题，你只需要在你的 React 项目上运行 npm build。

Axios未使用https进行代理设置

3 个答案: