如何修复Cross-Origin Request Blocked跨域请求拦截错误？

你遇到的是**跨域资源共享（CORS）**问题，浏览器的同源策略会阻止前端页面从不同域名、端口或协议的地址请求资源。即便你在本地同时运行服务器和MongoDB，只要前端页面的服务端口和后端API的服务端口不一致（比如前端用3000、后端用5000），就会触发这个拦截。

以下是几种直接可行的解决办法：

• 后端配置CORS允许本地请求
  假设你用Node.js+Express搭建后端，用cors中间件就能快速解决：

  1. 安装依赖：npm install cors
  2. 在后端入口文件（如server.js）中引入并配置：

     const cors = require('cors');
     const express = require('express');
     const app = express();
     
     // 指定允许的前端地址，替换成你实际的前端端口
     app.use(cors({ origin: 'http://localhost:3000' }));
     

  要是用其他后端框架，核心逻辑都是在响应头里添加Access-Control-Allow-Origin字段，明确允许的前端来源。

• 前端配置开发服务器代理
  如果你用React、Vue这类框架，可以通过代理把API请求转发到后端端口，避免跨域：
  比如React项目的package.json里添加：

  "proxy": "http://localhost:5000"
  

  这样前端请求/api/register时，会自动转发到http://localhost:5000/api/register，和前端同端口访问，绕过同源策略。

• 检查MongoDB连接有效性
  先确认后端连接MongoDB的地址是正确的本地地址（比如mongodb://localhost:27017），虽然数据库连接本身不会直接导致跨域，但如果后端因连接失败返回异常，可能被前端误判为跨域问题，先排查这一点。

内容的提问来源于stack exchange，提问作者Boris Borisov