React项目中Cross-Origin-Embedder-Policy配置错误求助

问题原因 #

helmet.crossOriginEmbedderPolicy() 中间件仅支持两种合法策略值："require-corp" 和 "credentialless"，你配置的 "cross-origin" 并非有效选项，因此触发错误。

修复方案 #

将 helmet.crossOriginEmbedderPolicy 的策略参数改为合法值即可，两种常用配置说明：

• "require-corp"（推荐）：要求所有嵌入资源必须同源，或通过跨源资源共享(CORS)、跨源隔离策略(COOP)明确允许跨源访问，是最常用的安全配置。
• "credentialless"：允许跨源嵌入资源，但不会随请求发送用户凭证（如Cookie、HTTP认证信息），适合无需凭证的场景。

修正后的完整代码 #

//configuration
dotenv.config()
const app = express()
app.use(express.json())
app.use(helmet())
// 替换为合法策略值，此处以require-corp为例
app.use(helmet.crossOriginEmbedderPolicy({policy:"require-corp"}))
app.use(morgan("common"))
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({extended:false}))
app.use(cors())

//routes
app.use("/client",clientRoutes);
app.use("/general",generalRoutes);
app.use("/management",managementRoutes);
app.use("/sales",salesRoutes);

//mongodb setup
// 修正端口变量拼写错误：PROT → PORT
const PORT=process.env.PORT || 9000;
mongoose
.connect(process.env.MONGO_URL,{
    useNewUrlParser:true,
    // 修正MongoDB配置拼写错误：useUnifiedTpology → useUnifiedTopology
    useUnifiedTopology:true,
})
.then(()=>{
    app.listen(PORT,()=>console.log(`Server Port:${PORT}`));
})
.catch((error)=>console.log(`${error} did not connect`));

额外提示 #

原代码存在两处拼写错误，已在修正代码中标注：

1. 端口变量 process.env.PROT 应为 process.env.PORT，否则会导致端口读取失败，默认使用9000。
2. MongoDB连接配置 useUnifiedTpology:true 应为 useUnifiedTopology:true，否则可能出现连接警告或异常。

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