问题描述
我正在遵循此基本指南来设置一个本地开发环境，同时运行react和node.在将以下内容的语句添加到".proxy"之后，我陷入了困境:" http://localhost:4001 语句react目录.它一直在说:代理错误:无法将请求/flower从localhost:51427代理到 http://localhost:4001 .
I am following this basic guide to set up a local dev environment with both react and node running. I am stuck after adding a "proxy": "http://localhost:4001" statement to the package.json of the react directory. It keeps saying: Proxy error: Could not proxy request /flower from localhost:51427 to http://localhost:4001.
环境:不涉及身份验证.这只是样板node.js和create-react-app设置. create-react-app版本为3.0.1.我正在使用Mac.
Environment: There's no authentication involved. It is just a boilerplate node.js and create-react-app setup. The create-react-app version is 3.0.1. I am using a Mac.
我尝试了以下方法来解决此问题:
I tried the following way to figure this problem out:
- 我已验证服务器运行正常，并且localhost:4001确实提供了数据.
- 我检查了浏览器开发工具，发现错误是GET http://localhost:51427/flower 500(内部服务器错误)
- 我还在服务器的package.json中添加了"--ignore client"
- 我还尝试按照以下说明安装http-proxy-middleware: https://create-react-app.dev/docs/proxying-api-requests-in-development/.
- I verified that the server is running correctly and localhost:4001 does provide data back.
- I checked the browser dev tool and see the error is GET http://localhost:51427/flower 500 (Internal Server Error)
- I also added a "--ignore client" in the server's package.json
- I also tried installing http-proxy-middleware per this instruction: https://create-react-app.dev/docs/proxying-api-requests-in-development/.
以下是用于响应的包json:
Here's the package json for react:
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.11.0",
"react-dom": "^16.11.0",
"react-scripts": "3.2.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"proxy": "http://localhost:4001"
}
react的本地主机页面为空白，而不是文本.控制台日志还确认未接收到数据.
The localhost page of react is blank instead of having text. The console log also confirms no data is received.
推荐答案
经过无数次搜索，我发现了问题并使其正常工作！！！
After countless searches, I figured out the problem and got it working!!!
首先，由于当我在react上运行npm命令时出现代理错误，因此我发现package.json中的proxy语句正在工作.由于我也可以通过localhost:4001到达服务器，因此问题必须出在React服务器以某种方式找不到node.js服务器，即不在同一通信通道中.
First, since the proxy error was showing up when I ran the npm command on react, I figured that the proxy statement in my package.json was working. Since I could also reach the server through localhost:4001, the problem must be that the react server somehow couldn't find the node.js server, i.e. not in the same channel of communication etc.
然后我进行搜索，发现问题与它们不能同时运行有关(我还考虑了另一种可能性，例如一种在ipv4上运行而另一种在ipv6上运行，但这似乎是最可能的解决方案).这个答案帮助我弄清楚了如何实现它:.
I then searched and found the issue has to do with them not running concurrently (I also considered other possibility like one running on ipv4 vs the other one running on ipv6 but this one seems to be the most likely solution). This answer helped me figure out how to make it happen: Could not proxy request /pusher/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED).
但是并发请求将失败，因为当它尝试运行客户端时，它将因端口始终被阻塞而失败.例如，当我运行"npm start --prefix client"时，即使我更改了package.json中的端口，它也将始终报告端口XXX上正在运行某些内容".然后我发现问题不必为我的本地主机设置正确的配置，而这个答案帮助了我:.
But then the concurrent request would fail because when it tried to run the client, it would fail because a port would always be clogged. For example when i run "npm start --prefix client", even if I changed the port in package.json, it would always report "something running on port XXX". I then figured out the issue has to do not having the right config set up for my localhost and this answer helped me out: npm start reports "Something is already running on port XXX" no matter what XXX is.
现在同时运行，它终于可以工作了.
Now with concurrently, it is finally working.
这篇关于不断收到“代理错误:无法代理请求"；添加代理以响应package.json后出现错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！