Cross domain api setting

若要請求跨域的api且需要Preflight request，後端就需新增OPTIONS的http header來讓遊覽器知道該允許或禁止請求．

範例代碼：

// nodejs code

import http from 'node:http';
import fs from 'node:fs';

console.log('start run server');

const server = http.createServer((req, res) => {
    // 若收到Options請求，header返回可允許的設定來告訴遊覽器允許跨域的條件
    if (req.method === 'OPTIONS') {
        res.appendHeader('Access-Control-Allow-Origin', '*') // 返回允許的白名單域名(*表示全部允許)
        res.appendHeader('Access-Control-Allow-Methods', 'PUT')
        res.appendHeader('Access-Control-Allow-Headers',
            "client_id, Authorization, Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers")
        res.statusCode = 200
        res.end()
        return
    }

    // 
    if (['PUT', 'GET'].includes(req.method) && req.url.includes('api/cors-test')) {
        res.appendHeader('Access-Control-Allow-Origin', '*') // 返回允許的白名單域名(*表示全部允許)
        res.setHeader('Content-Type', 'application/json')
        // res.statusCode = 500
        res.write(Buffer.from(JSON.stringify({
            "code": 200,
            "message": "操作成功",
            "data": {
              "id": 123,
              "memberId": 7019,
              "nickname": "測試者01",
              "isTag": true,
              "isAi": false,
              "msg": "測試內容"
            }
          })));
        res.end();
        console.log('send api done')
    }
});

const port = 6336;
server.listen(port, () => {
    console.log(`server listen port ${port} ...`);
});

Reference

Cross-Origin Resource Sharing (CORS)

Cross-Origin Resource Policy (CORP)

Content Security Policy (CSP)

CORS errors