Nodejs 自訂 CORS

CORS（跨來源資源共用） 是一種允許一個網域上的 Web 應用程式存取另一個網域上的資源的機制。當開發前端和後端分離並透過 API 進行通訊的應用程式時，這一點至關重要。

這裡有一篇文章解釋了在 Node.js 和 Express 中不使用外部函式庫的 CORS 實作：

"use strict";

/*jshint node:true */

var simpleMethods, simpleRequestHeaders, simpleResponseHeaders, toLowerCase, checkOriginMatch, origin;

Object.defineProperty(exports, "simpleMethods", {
    get: function () {
        return [
            "GET",
            "HEAD",
            "POST",
            "PUT",
            "DELETE"
        ];
    }
});
simpleMethods = exports.simpleMethods;

Object.defineProperty(exports, "origin", {
    get: function () {
        return ["http://localhost:3000"];
    }
});
origin = exports.origin;

Export simpleMethods：定義 CORS 請求允許的 HTTP 方法（例如 GET、POST、PUT 等）。

匯出來源：指定允許存取的來源清單。在此範例中，允許使用 http://localhost:3000。

Object.defineProperty(exports, "simpleRequestHeaders", {
    get: function () {
        return ["accept", "accept-language", "content-language", "content-type", "authorization", "token"];
    }
});
simpleRequestHeaders = exports.simpleRequestHeaders;

Object.defineProperty(exports, "simpleResponseHeaders", {
    get: function () {
        return ["cache-control", "content-language", "content-type", "expires", "last-modified", "pragma"];
    }
});
simpleResponseHeaders = exports.simpleResponseHeaders;

匯出 simpleRequestHeaders：定義跨域請求中客戶端允許的請求標頭。

匯出 simpleResponseHeaders：定義允許從伺服器到客戶端的回應標頭。

checkOriginMatch = function (originHeader, origins, callback) {
    if (typeof origins === "function") {
        origins(originHeader, function (err, allow) {
            callback(err, allow);
        });
    } else if (origins.length > 0) {
        callback(null, origins.some(function (origin) {
            return origin === originHeader;
        }));
    } else {
        callback(null, true);
    }
};

函數 checkOriginMatch：檢查請求來源是否與允許的來源清單相符。如果匹配，則允許請求。

exports.create = function (options) {
    options = options || {};
    options.origins = options.origins || origin;
    options.methods = options.methods || simpleMethods;

來源和方法選項的初始化，如果沒有提供，則使用來自 origin 和 simpleMethods 的預設值。

設定請求與回應標頭

 if (options.hasOwnProperty("requestHeaders") === true) {
        options.requestHeaders = toLowerCase(options.requestHeaders);
    } else {
        options.requestHeaders = simpleRequestHeaders;
    }

    if (options.hasOwnProperty("responseHeaders") === true) {
        options.responseHeaders = toLowerCase(options.responseHeaders);
    } else {
        options.responseHeaders = simpleResponseHeaders;
    }

設定允許的請求（requestHeaders）和回應（responseHeaders）標頭。將任何給定的請求或回應標頭轉換為小寫。

附加中間件配置

 options.maxAge = options.maxAge || null;
    options.supportsCredentials = options.supportsCredentials || false;

    if (options.hasOwnProperty("endPreflightRequests") === false) {
        options.endPreflightRequests = true;
    }

maxAge：指定 CORS 預檢的最大快取期限。 supportCredentials：決定伺服器是否支援跨網域請求中的憑證（cookie 或令牌）。 endPreflightRequests：決定伺服器是否應終止預檢請求（選項）或繼續執行下一個中間件。

 return function (req, res, next) {
        if (!req.headers.hasOwnProperty("origin")) {
            next();
        } else {
            checkOriginMatch(req.headers.origin, options.origins, function (err, originMatches) {
                if (err !== null) {
                    next(err);
                } else {
                    var endPreflight = function () {
                        if (options.endPreflightRequests === true) {
                            res.writeHead(204);
                            res.end();
                        } else {
                            next();
                        }
                    };

函數 endPreflight：如果 endPreflightRequests 設定為 true，則結束預檢（OPTIONS）要求。來源檢查：使用 checkOriginMatch 來驗證請求來源是否與允許的來源相符。

處理預檢請求（選項）

 if (req.method === "OPTIONS") {
                        if (!req.headers.hasOwnProperty("access-control-request-method")) {
                            endPreflight();
                        } else {
                            requestMethod = req.headers["access-control-request-method"];
                            if (req.headers.hasOwnProperty("access-control-request-headers")) {
                                requestHeaders = toLowerCase(req.headers["access-control-request-headers"].split(/,\s*/));
                            } else {
                                requestHeaders = [];
                            }

                            methodMatches = options.methods.indexOf(requestMethod) !== -1;
                            if (!methodMatches) {
                                endPreflight();
                            } else {
                                headersMatch = requestHeaders.every(function (requestHeader) {
                                    return options.requestHeaders.includes(requestHeader);
                                });

                                if (!headersMatch) {
                                    endPreflight();
                                } else {
                                    if (options.supportsCredentials) {
                                        res.setHeader("Access-Control-Allow-Origin", req.headers.origin);
                                        res.setHeader("Access-Control-Allow-Credentials", "true");
                                    } else {
                                        res.setHeader("Access-Control-Allow-Origin", "*");
                                    }

                                    if (options.maxAge !== null) {
                                        res.setHeader("Access-Control-Max-Age", options.maxAge);
                                    }

                                    res.setHeader("Access-Control-Allow-Methods", options.methods.join(","));
                                    res.setHeader("Access-Control-Allow-Headers", options.requestHeaders.join(","));
                                    endPreflight();
                                }
                            }
                        }
                    }

請求方法和標頭匹配：檢查請求方法和標頭是否與允許的匹配。 CORS 回應標頭：設定 CORS 標頭，例如 Access-Control-Allow-Origin、Access-Control-Allow-Credentials、Access-Control-Allow-Methods 等

在回應中公開標頭
} 其他 {
if (options.supportsCredentials) {
res.setHeader("Access-Control-Allow-Origin", req.headers.origin);
res.setHeader("Access-Control-Allow-Credentials", "true");
} 其他 {
res.setHeader("Access-Control-Allow-Origin", "*");
}

"use strict";

/*jshint node:true */

var simpleMethods, simpleRequestHeaders, simpleResponseHeaders, toLowerCase, checkOriginMatch, origin;

Object.defineProperty(exports, "simpleMethods", {
    get: function () {
        return [
            "GET",
            "HEAD",
            "POST",
            "PUT",
            "DELETE"
        ];
    }
});
simpleMethods = exports.simpleMethods;

Object.defineProperty(exports, "origin", {
    get: function () {
        return ["http://localhost:3000"];
    }
});
origin = exports.origin;

Object.defineProperty(exports, "simpleRequestHeaders", {
    get: function () {
        return ["accept", "accept-language", "content-language", "content-type", "authorization", "token"];
    }
});
simpleRequestHeaders = exports.simpleRequestHeaders;

Object.defineProperty(exports, "simpleResponseHeaders", {
    get: function () {
        return ["cache-control", "content-language", "content-type", "expires", "last-modified", "pragma"];
    }
});
simpleResponseHeaders = exports.simpleResponseHeaders;

Access-Control-Expose-Headers：如果 simpleResponseHeaders 中未包含自訂標頭，則設定客戶端可存取的回應標頭。

這就是如何在 Node.js 中實作自訂 CORS，而無需使用任何函式庫。完整的腳本可以參考這個範例

以上是Nodejs 自訂 CORS的詳細內容。更多資訊請關注PHP中文網其他相關文章！