如何解决由于 CORS 策略,从源 http://localhost:3000 访问 xmlhttprequest 已被阻止
我为我正在开发的应用程序设置了前端和后端,我想测试从前端到后端发送的 http 请求,而这两个请求在 localhost 中运行。
使用 React 发送代码请求:
async componentDidMount(){
const {data: posts}= await axios.get("localhost:8765/...");
}
使用 Express 的应用服务器代码:
const express = require('express')
const app = express()
require('./routes/...')(app)
app.listen(8765,() => {
console.log("Server is listening on port 8765.")
})
前端在 localhost 3000 上运行。
这是我得到的错误:
Access to XMLHttpRequest at 'localhost:8765/...' from origin 'http://localhost:3000'
has been blocked by CORS policy: Cross origin requests are only supported for protocol
schemes: http,data,chrome,chrome-extension,chrome-untrusted,https.
我尝试了网上找到的各种解决方案,例如:
var cors = require('cors');
app.use(cors({origin: 'http://localhost:3000'}));
或:
app.use(function (req,res,next) {
res.setHeader('Access-Control-Allow-Origin','http://localhost:8888');
res.setHeader('Access-Control-Allow-Methods','GET,POST,OPTIONS,PUT,PATCH,DELETE');
res.setHeader('Access-Control-Allow-Headers','X-Requested-With,content-type');
res.setHeader('Access-Control-Allow-Credentials',true);
next();
});
或:
app.use(cors())
虽然似乎没有任何效果,但我仍然遇到同样的错误,而且我已经被困在这个问题上很长一段时间了。有什么想法吗?
解决方法
只需使用 res.setHeader('Access-Control-Allow-Origin','*');
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。