คอร์เซอร์

คอร์เซอร์

การใช้งาน CORS สำหรับ Node.js ที่เข้ากันได้กับมิดเดิลแวร์ที่กำหนดค่าได้สูง

บันทึกการเปลี่ยนแปลง

2.0.1 (16 สิงหาคม 2559)

• เพิ่มวิธีแก้ปัญหาสำหรับ Chrome 52 ที่ส่งส่วนหัว Access-Control-Request-Headers ที่ว่างเปล่า

2.0.0 (22 มีนาคม 2557)

• คำขอก่อนเที่ยวบินจะถูกปิดโดยอัตโนมัติ หากมีความจำเป็นในการจัดการคำขอ OPTIONS ให้ตรวจสอบตัวเลือก endPreflightRequests
• พารามิเตอร์ของฟังก์ชันการโทรกลับในการตรวจสอบต้นกำเนิดแบบไดนามิกอยู่ในขณะนี้ (err, matches) แทนที่จะเป็นเพียงแค่ (matches)

ตัวอย่าง

วิธีใช้ Corser เป็นมิดเดิลแวร์ใน Express

ดู example/express/ สำหรับตัวอย่างการทำงาน

 var express, corser, app;

express = require("express");
corser = require("corser");

app = express();

app.use(corser.create());

app.get("/", function (req, res) {
    res.writeHead(200);
    res.end("Nice weather today, huh?");
});

app.listen(1337);

วิธีใช้ Corser เป็นมิดเดิลแวร์ใน Connect

ดู example/connect/ สำหรับตัวอย่างการทำงาน

 var connect, corser, app;

connect = require("connect");
corser = require("corser");

app = connect();

app.use(corser.create());

app.use(function (req, res) {
    res.writeHead(200);
    res.end("Nice weather today, huh?");
});

app.listen(1337);

วิธีใช้ Corser กับ http ธรรมดา

 var http, corser, corserRequestListener;

http = require("http");
corser = require("corser");

// Create Corser request listener.
corserRequestListener = corser.create();

http.createServer(function (req, res) {
    // Route req and res through the request listener.
    corserRequestListener(req, res, function () {
        res.writeHead(200);
        res.end("Nice weather today, huh?");
    });
}).listen(1337);

เอพีไอ

การสร้างผู้ฟังคำขอ Corser

การสร้าง Listener คำขอ Corser ที่สร้างส่วนหัวการตอบสนองที่เหมาะสมเพื่อเปิดใช้งาน CORS นั้นง่ายดายเพียง:

 corser.create()

นี่เทียบเท่ากับการตั้งค่าส่วนหัวการตอบสนองของ Access-Control-Allow-Origin: * หากคุณต้องการจำกัดต้นกำเนิด หรืออนุญาตคำขอหรือส่วนหัวการตอบกลับที่ซับซ้อนมากขึ้น คุณต้องส่งอ็อบเจ็กต์การกำหนดค่าไปที่ corser.create

Corser จะสิ้นสุดคำขอ preflight สำหรับคุณโดยอัตโนมัติ คำขอ preflight คือคำขอ OPTIONS พิเศษที่เบราว์เซอร์ส่งภายใต้เงื่อนไขบางประการเพื่อเจรจากับเซิร์ฟเวอร์ว่าวิธีใด ส่วนหัวคำขอ และส่วนหัวการตอบกลับที่ได้รับอนุญาตสำหรับคำขอ CORS หากคุณต้องการใช้วิธี OPTIONS สำหรับสิ่งอื่นๆ เพียงตั้งค่า endPreflightRequests เป็น false และยุติคำขอเหล่านั้นด้วยตนเอง:

 var corserRequestListener;

corserRequestListener = corser.create({
    endPreflightRequests: false
});

corserRequestListener(req, res, function () {
    if (req.method === "OPTIONS") {
        // End CORS preflight request.
        res.writeHead(204);
        res.end();
    } else {
        // Implement other HTTP methods.
    }
});

วัตถุการกำหนดค่า

อ็อบเจ็กต์การกำหนดค่าที่มีคุณสมบัติต่อไปนี้สามารถส่งผ่านไปยัง corser.create ได้

origins

รายการที่อนุญาตพิเศษของต้นกำเนิด หากคำขอมาจากต้นทางที่ไม่ได้อยู่ในรายการนี้ CORS จะไม่จัดการ หากต้องการยอมรับต้นกำเนิดทั้งหมด (พฤติกรรม Access-Control-Allow-Origin: * ) ให้ละเว้นคุณสมบัติหรือตั้งค่าเป็นอาร์เรย์ว่าง ( [] )

เพื่อให้สามารถตรวจสอบจุดกำเนิดแบบไดนามิกได้ สามารถส่งฟังก์ชัน (origin, callback) แทนอาร์เรย์ได้ origin คือส่วนหัวของ Origin callback เป็นฟังก์ชัน (err, matches) โดยที่ matches คือแฟล็กบูลีนที่ระบุว่าส่วนหัวของ Origin ที่กำหนดตรงกันหรือไม่

ค่าเริ่มต้น: ยอมรับต้นทางทั้งหมด

methods

รายการวิธีตัวพิมพ์ใหญ่ที่อนุญาต หากคำขอใช้วิธีการที่ไม่อยู่ในรายการนี้ CORS จะไม่ได้รับการจัดการ

การตั้งค่าที่นี่จะเขียนทับรายการวิธีการพื้นฐานแบบง่ายที่เป็นค่าเริ่มต้น เพื่อไม่ให้สูญเสียไปให้เชื่อมต่อวิธีการที่คุณต้องการเพิ่มด้วย corser.simpleMethods : corser.simpleMethods.concat(["PUT", "DELETE"])

ค่าเริ่มต้น: วิธีการแบบง่าย ( GET , HEAD , POST )

requestHeaders

รายการส่วนหัวคำขอที่ไม่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ หากคำขอใช้ส่วนหัวคำขอที่ไม่อยู่ในรายการนี้ CORS จะไม่จัดการ

การตั้งค่าที่นี่จะเขียนทับรายการส่วนหัวคำขอแบบง่ายเริ่มต้น เพื่อไม่ให้สูญเสียไป ให้เชื่อมต่อส่วนหัวคำขอที่คุณต้องการเพิ่มด้วย corser.simpleRequestHeaders : corser.simpleRequestHeaders.concat(["Authorization"])

ค่าเริ่มต้น: ส่วนหัวคำขอแบบง่าย ( Accept , Accept-Language , Content-Language , Content-Type , Last-Event-ID )

responseHeaders

รายการส่วนหัวการตอบกลับที่ไม่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ ส่วนหัวการตอบกลับใดๆ ที่ไม่ได้อยู่ในรายการนี้จะถูกกรองออกโดยตัวแทนผู้ใช้ (เบราว์เซอร์)

การตั้งค่าที่นี่จะเขียนทับรายการส่วนหัวการตอบกลับแบบง่ายที่เป็นค่าเริ่มต้น เพื่อไม่ให้สูญเสียไป ให้เชื่อมต่อส่วนหัวการตอบกลับที่คุณต้องการเพิ่มด้วย corser.simpleResponseHeaders : corser.simpleResponseHeaders.concat(["ETag"])

ค่าเริ่มต้น: ส่วนหัวการตอบกลับแบบธรรมดา ( Cache-Control , Content-Language , Content-Type , Expires , Last-Modified , Pragma )

supportsCredentials

บูลีนที่ระบุว่าสามารถโอนข้อมูลรับรองคุกกี้เป็นส่วนหนึ่งของคำขอ CORS ได้หรือไม่ ปัจจุบันมีองค์ประกอบ HTML5 เพียงไม่กี่รายการเท่านั้นที่จะได้ประโยชน์จากการตั้งค่านี้

ค่าเริ่มต้น: false

maxAge

จำนวนเต็มที่ระบุจำนวนเวลาสูงสุดในหน่วยวินาทีที่คำขอ preflight ถูกเก็บไว้ในแคชผลลัพธ์ preflight ฝั่งไคลเอ็นต์

ค่าเริ่มต้น: ไม่ได้ตั้งค่า

endPreflightRequests

บูลีนที่ระบุว่าคำขอ CORS preflight ควรถูกปิดโดยอัตโนมัติหรือไม่

ค่าเริ่มต้น: true

คำถามที่พบบ่อย

คำขอส่งคืน Origin X is not allowed by Access-Control-Allow-Origin

ตรวจสอบว่าส่วนหัว Origin ของคำขอของคุณตรงกับหนึ่งในต้นกำเนิดที่ให้ไว้ในคุณสมบัติ origins ของออบเจ็กต์การกำหนดค่าหรือไม่ หากคุณไม่ได้ตั้งค่าคุณสมบัติ origins ใดๆ ให้ข้ามไปที่คำถามถัดไป

หากวิธีนี้ไม่ได้ผล คำขอของคุณอาจใช้วิธีที่ไม่ธรรมดาหรือส่วนหัวที่ไม่ธรรมดาตั้งแต่หนึ่งรายการขึ้นไป (ดูคำถามถัดไป) ตามข้อกำหนด ชุดของวิธีการแบบง่ายคือ GET , HEAD และ POST และชุดของส่วนหัวคำขอแบบง่ายคือ Accept , Accept-Language , Content-Language , Content-Type และ Last-Event-ID หากคำขอของคุณใช้วิธีการหรือส่วนหัว อื่น คุณต้องแสดงรายการอย่างชัดเจนใน methods หรือคุณสมบัติ requestHeaders ของออบเจ็กต์การกำหนดค่า

ตัวอย่าง

คุณต้องการอนุญาตคำขอที่ใช้ส่วนหัว X-Requested-With ส่งผ่านวัตถุการกำหนดค่าต่อไปนี้ไปที่ corser.create :

 corser.create({
    requestHeaders: corser.simpleRequestHeaders.concat(["X-Requested-With"])
});

คำขอส่งคืน Request header field Content-Type is not allowed by Access-Control-Allow-Headers

การกำหนดค่าเริ่มต้นจะใช้ได้ก็ต่อเมื่อไคลเอนต์ส่งคำขอ "แบบง่าย" เช่น GET , HEAD , POST เป็นวิธีการ และส่วนหัวบางส่วน เช่น Accept , Accept-Language , Content-Language และ Content-Type เป็นต้น Content-Type มีข้อจำกัดที่สำคัญ: อนุญาตให้ใช้เฉพาะ application/x-www-form-urlencoded , multipart/form-data และ text/plain เท่านั้น

โดยทั่วไป Content-Type ของ API จะเป็น application/json และไม่ได้รับอนุญาตตามค่าเริ่มต้น Content-Type จะต้องระบุอย่างชัดเจนในวัตถุการกำหนดค่าภายใต้คีย์ requestHeaders :

ตัวอย่าง

 corser.create({
    requestHeaders: corser.simpleRequestHeaders.concat(["Content-Type"])
});

การรับส่วนหัวการตอบกลับถูกส่งคืน Refused to get unsafe header "X"

เบราว์เซอร์ของคุณบล็อกส่วนหัวการตอบกลับที่ไม่ธรรมดาทุกอันที่ไม่ได้รับอนุญาตอย่างชัดเจนในคำขอก่อนบิน ชุดของส่วนหัวการตอบกลับแบบง่ายคือ Cache-Control , Content-Language , Content-Type , Expires , Last-Modified , Pragma หากคุณต้องการเข้าถึงส่วนหัวการตอบกลับ อื่น คุณต้องแสดงรายการอย่างชัดเจนในคุณสมบัติ responseHeaders ของออบเจ็กต์การกำหนดค่า

ตัวอย่าง

คุณต้องการอนุญาตให้ไคลเอ็นต์อ่านส่วนหัว ETag ของการตอบกลับ ส่งผ่านวัตถุการกำหนดค่าต่อไปนี้ไปที่ corser.create :

 corser.create({
    responseHeaders: corser.simpleResponseHeaders.concat(["ETag"])
});