当你遇到 login:1 Access to XMLHttpRequest at 'http://127.0.0.1:58081/api/v1/user/login' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
这样的错误时,这通常是因为浏览器的同源策略(Same-Origin Policy)阻止了跨源(Cross-Origin)HTTP 请求。
解释
- 同源策略:浏览器出于安全考虑,限制了一个源(协议+域名+端口)的文档或脚本中发起的请求不能访问与源不同的服务器资源。
- CORS(跨源资源共享):是一种机制,它使用额外的 HTTP 头部来告诉浏览器允许一个源(域)的网页中运行的脚本访问来自不同源服务器上的指定资源。
解决方案
选择哪种解决方案取决于你的具体需求和环境。在生产环境中,通常建议配置后端以允许来自你前端应用的确切源的 CORS 请求。
-
后端设置 CORS 头部:
在你的后端服务(在这个例子中是运行在http://127.0.0.1:58081
的服务)中设置 CORS 头部。这通常涉及在响应中添加Access-Control-Allow-Origin
头部。例如,如果你允许所有源&#