MERN：由于 CORS 错误，无法将 React 连接到后端 [重复]

Question

我已经构建了一个微服务后端，部署在 Digital Ocean 上的 kubernetes 上。

我正在尝试将我的反应代码连接到后端并收到以下错误：

Access to XMLHttpRequest at 'http://cultor.dev/api/users/signin' from origin 'http://localhost:3000'
has been blocked by CORS policy: Response to preflight request doesn't pass access control check: 
Redirect is not allowed for a preflight request.

Index.ts 设置：

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', '*');
  res.header('Access-Control-Request-Headers', '*');
  if (req.method === "OPTIONS") {
    res.header('Access-Control-Allow-Methods', '*');
    return res.status(200).json({});
  }
  next();
});

非常感谢您的帮助。谢谢！

Answer 1

用

安装cors中间件

npm install cors

你可以像这样直接使用它：

const cors = require('cors');  
app.use(cors());

或者您可以像这样设置特定选项：

const cors = require('cors');    
const corsOpts = {
    origin: '*',
    credentials: true,
    methods: ['GET','POST','HEAD','PUT','PATCH','DELETE'],
    allowedHeaders: ['Content-Type'],
    exposedHeaders: ['Content-Type']
};
app.use(cors(corsOpts));

您可以将 origin 替换为您的网站，并将 allowedHeaders 替换为您要使用的标题。

Answer 2

我建议尝试使用 cors 中间件，而不是自己放置标头。也许你错过了一些东西。您可以从 npm 下载 cors 中间件并在您的 express 应用中使用它

const cors = require('cors')

app.use(cors())