提问者:小点点

由于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.")
})

前端正在本地主机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())

但似乎什么都不管用,我还是犯了同样的错误,而且我已经陷在这里面很长时间了,有什么想法吗?


共1个答案

匿名用户

只需使用res.setheader('access-control-allow-origin','*');