简体繁体 English

前端 package.json 中的代理配置如何请求 void cors？

[英]How does a proxy config in frontend package.json a void cors request?

原文 2021-12-18 09:20:27 6 1 node.js/ proxy/ request/ cors/ package.json

maybe I didn't quite understand proxys yet, but I have my server backend on localhost:7000 and my frontend client on localhost:3000.也许我还不太了解代理，但我的服务器后端位于 localhost:7000，前端客户端位于 localhost:3000。 Now I configured a proxy in my frontend package.json: "proxy": "http://127.0.0.1:7000" .现在我在我的前端 package.json: "proxy": "http://127.0.0.1:7000"中配置了一个代理。 This avoided the cors installation in the backend and accepted requests to my server.这避免了在后端安装 cors 并接受了对我的服务器的请求。 How does that work or why is it avoiding the cors configuration?这是如何工作的，或者为什么要避免 cors 配置？ And whats the difference then between the proxy and cors?那么代理和cors有什么区别？

1 个解决方案

CORS errors occur up due to the same-origin policy that is implemented in most browsers. CORS 错误是由于大多数浏览器中实施的同源策略而发生的。 More specifically the reason you are getting the error is because you're making a request to a different origin from the one you're currently on.更具体地说，您收到错误的原因是因为您正在向与您当前所在的来源不同的来源发出请求。 In your case that's your frontend running on http://localhost:3000 which is trying to access the backend on http://localhost:7000在您的情况下，这是您在http://localhost:3000上运行的前端，它试图访问http://localhost:7000上的后端

In order to fix this, you could change your backend to send the Access-Control-Allow-Origin response header where you include the frontend's origin - or... you use a proxy.为了解决这个问题，您可以更改后端以发送Access-Control-Allow-Origin响应 header ，其中包含前端的来源 - 或者......您使用代理。

The Proxy basically attempts to fool the browser by pretending to have your backend on the same origin localhost:3000 whereas underneath the hood it's accessing the resource from the actual origin localhost:7000 .代理基本上试图通过假装让您的后端位于同一来源localhost:3000上来欺骗浏览器，而在后台它正在从实际来源localhost:7000访问资源。

You can read this article which explains it in further detail.你可以阅读这篇文章，它更详细地解释了它。