我知道这种问题以前已经解决过,但我无法确切地弄清楚为什么它不适合我的情况。
我正在本地开发一个网站,我想在各种平台和设备上测试它,所以我决定使用 ngrok 来实现这一点。
我的前端在端口 3000 上运行,我的 Express 服务器在端口 5000 上运行。
所以我打开ngrok并输入ngrok http 3000
在我的本地 PC 上,服务器正在运行,它https://example.ngrok.io按预期工作,没有任何问题。
但在我的笔记本电脑(或其他设备)上,前端显示正确,但当它实际上要从后端获取数据时,它显示错误:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:5000/weather/51.87575912475586,0.9436600208282471. (Reason: CORS request did not succeed).
在我的 Express 服务器上,我确保使用 cors 包,并且app.use(cors());我还尝试手动添加标头:
app.all('/*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
next();
});
Run Code Online (Sandbox Code Playgroud)
来源:为什么将 CORS 标头添加到 OPTIONS 路由不允许浏览器访问我的 API?
这也是我的代码,我在其中获取和获取数据,以防我在那里做错了什么:
index.js(前端)
const response = await fetch(`http://localhost:5000/weather/${lat},${lng}`); //sending request to server-side
const json = …Run Code Online (Sandbox Code Playgroud)