如何在Express.js中为Netlify分支子域名配置CORS规则？

在Express中，你不需要为每个Netlify分支域名单独配置CORS规则，利用cors包的动态origin验证函数就能实现匹配所有xxx--myurl.netlify.com格式的来源。

实现步骤： #

1. 安装cors依赖（如果还没装）：

   npm install cors
   

2. 编写自定义origin验证逻辑：
   检查请求头中的Origin是否符合{分支名}--myurl.netlify.com的格式，也可以同时允许主域名（可选）。用字符串后缀匹配或正则表达式都能实现：

   const cors = require('cors');
   const express = require('express');
   const app = express();
   
   // 定义允许的域名后缀
   const allowedDomainSuffix = '--myurl.netlify.com';
   // 可选：同时允许主域名
   const mainDomain = 'myurl.netlify.com';
   
   const corsOptions = {
     origin: function (origin, callback) {
       // 允许localhost（开发环境测试用，可根据需求调整）、主域名、所有分支域名
       if (!origin || origin === mainDomain || origin.endsWith(allowedDomainSuffix)) {
         callback(null, true);
       } else {
         callback(new Error('Not allowed by CORS'));
       }
     },
     // 若前端需要传递cookie/认证信息，必须开启此项
     credentials: true
   };
   
   // 给所有路由应用CORS规则
   app.use(cors(corsOptions));
   
   // 示例路由
   app.get('/api/hello', (req, res) => {
     res.json({ msg: '请求成功' });
   });
   
   app.listen(process.env.PORT || 3000, () => {
     console.log('后端服务已启动');
   });
   

3. 关键细节：

   • origin参数为函数时，会自动接收请求的Origin头和回调函数，验证通过则调用callback(null, true)，否则返回错误。
   • !origin是为了兼容无Origin头的请求（比如Postman测试），不需要的话可以删除。
   • 如果前端需要发送凭证（如cookie），除了后端设置credentials: true，前端请求也要对应开启withCredentials: true（比如Axios请求中配置）。

4. 验证方式：
   部署任意分支前端（如feature123--myurl.netlify.com），发起跨域请求到Heroku后端，查看浏览器控制台是否有CORS报错，也可以在后端打印req.headers.origin确认来源是否被正确匹配。

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