尽管添加了适当的标题，但仍被CORS策略错误阻止

Question

我正在尝试将我的React应用程序中的HTTP请求发送到其他端口上的本地服务器。但是，每次我发送发布http请求时，此错误都会发生：

cors错误

我在React应用中拥有的代码：

 const handleSubmit = async (e) => {
    e.preventDefault();
    const data = {ingredientInput};
    console.log(data.ingredientInput);
    console.log(JSON.stringify(data));
    const response = await fetch('http://localhost:5000/verify', {
        method: 'POST',
        
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin': '*',
        },
        body: JSON.stringify(data),
    });

这是我在服务器中拥有的代码。

const express = require('express');
const router = express.Router();
let bodyParser = require('body-parser');
router.use(bodyParser.json());
router.use((req, res, next) => {
    res.append('Access-Control-Allow-Origin', '*');
    res.append('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.append('Access-Control-Allow-Headers', 'Content-Type');
    next();
})

const PORT = 5000;

const app = express();

app.use(express.json());
const fs = require('fs');

app.post('/verify', (req, res) => {
    console.log(req.body);
})

我已经添加了浏览器状态的标题，例如“访问控制”标题，但CORS错误仍会发生。有人可以告诉我问题是什么吗？

Answer 1

您需要使用路由器。

app.use('/', router);