วิธีตั้งค่า Signed Exchange โดยใช้ Web Packager

ดูวิธีแสดง Signed Exchange (SXG) โดยใช้ Web Packager

Katie Hempenius
Katie Hempenius
X

Signed Exchange (SXG) คือกลไกการนำส่งที่ช่วยให้ตรวจสอบสิทธิ์แหล่งที่มาของทรัพยากรได้โดยไม่ขึ้นอยู่กับวิธีการนำส่ง วิธีการต่อไปนี้อธิบายวิธีตั้งค่า Signed Exchange โดยใช้ Web Packager วิธีการมีให้สำหรับทั้งใบรับรองแบบ Self-signed และCanSignHttpExchanges

แสดง SXG โดยใช้ใบรับรองที่ลงนามด้วยตนเอง

การใช้ใบรับรองที่ลงนามด้วยตนเองเพื่อแสดง SXG นั้นใช้เพื่อสาธิตและทดสอบเป็นหลัก SXG ที่ลงนามด้วยใบรับรองที่ลงนามด้วยตนเองจะสร้างข้อความแสดงข้อผิดพลาดในเบราว์เซอร์เมื่อใช้นอกสภาพแวดล้อมการทดสอบ และไม่ควรแสดงต่อ Crawler

ข้อกำหนดเบื้องต้น

หากต้องการทําตามวิธีการเหล่านี้ คุณจะต้องติดตั้ง openssl และ Go ในสภาพแวดล้อมการพัฒนาซอฟต์แวร์

สร้างใบรับรองที่ลงนามด้วยตนเอง

ส่วนนี้จะอธิบายวิธีสร้างใบรับรองที่ลงนามด้วยตนเองซึ่งสามารถใช้กับการรับส่งข้อมูลที่ลงนามได้

วิธีการ

  1. สร้างคีย์ส่วนตัว

    openssl ecparam -out priv.key -name prime256v1 -genkey

    ระบบจะบันทึกคีย์ส่วนตัวเป็นไฟล์ชื่อ priv.key

  2. สร้างคำขอลงชื่อใบรับรอง (CSR)

    openssl req -new -sha256 -key priv.key -out cert.csr -subj '/O=Web Packager Demo/CN=example.com'

    คำขอลงนามใบรับรองคือบล็อกข้อความที่เข้ารหัสซึ่งสื่อถึงข้อมูลที่จำเป็นในการขอใบรับรองจากผู้ออกใบรับรอง(CA) แม้ว่าคุณจะไม่ได้ขอใบรับรองจาก CA แต่ก็ยังจำเป็นต้องสร้างคำขอลงนามใบรับรอง

    คำสั่งข้างต้นจะสร้างคำขอลงนามใบรับรองสำหรับองค์กรที่มีชื่อว่า Web Packager Demo ซึ่งมีชื่อทั่วไป example.com ชื่อทั่วไปควรเป็นชื่อโดเมนที่สมบูรณ์ในตัวเองของเว็บไซต์ที่มีเนื้อหาที่คุณต้องการแพ็กเกจเป็น SXG

    ในการตั้งค่า SXG เวอร์ชันที่ใช้งานจริง เว็บไซต์นี้จะเป็นเว็บไซต์ที่คุณเป็นเจ้าของ อย่างไรก็ตาม ในสภาพแวดล้อมการทดสอบเช่นเดียวกับที่อธิบายไว้ในวิธีการเหล่านี้ อาจเป็นเว็บไซต์ใดก็ได้

  3. สร้างใบรับรองที่มีนามสกุล CanSignHttpExchanges

    openssl x509 -req -days 90 -in cert.csr -signkey priv.key -out cert.pem -extfile <(echo -e "1.3.6.1.4.1.11129.2.1.22 = ASN1:NULL\nsubjectAltName=DNS:example.com")

    คำสั่งนี้ใช้คีย์ส่วนตัวและ CSR ที่สร้างขึ้นในระยะที่ 1 และ 2 เพื่อสร้างไฟล์ใบรับรอง cert.pem Flag -extfile จะเชื่อมโยงใบรับรองกับส่วนขยายใบรับรอง CanSignHttpExchanges (1.3.6.1.4.1.11129.2.1.22 คือตัวระบุออบเจ็กต์สำหรับส่วนขยาย CanSignHttpExchanges) นอกจากนี้ Flag -extfile ยังกำหนด example.com เป็น Subject Alternative Name ด้วย

    หากสงสัยเกี่ยวกับเนื้อหาของ cert.pem คุณสามารถดูเนื้อหาดังกล่าวได้โดยใช้คำสั่งต่อไปนี้

    openssl x509 -in cert.pem -noout -text

    การสร้างคีย์ส่วนตัวและใบรับรองเสร็จแล้ว คุณต้องใช้ไฟล์ priv.key และ cert.pem ในส่วนถัดไป

ตั้งค่าเซิร์ฟเวอร์ Web Packager สำหรับการทดสอบ

ข้อกำหนดเบื้องต้น

  1. ติดตั้ง Web Packager

    git clone https://github.com/google/webpackager.git

  2. สร้าง webpkgserver

    cd webpackager/cmd/webpkgserver
go build .

    webpkgserver คือไบนารีที่เฉพาะเจาะจงภายในโปรเจ็กต์ Web Packager

  3. ยืนยันว่าได้ติดตั้ง webpkgserver อย่างถูกต้อง

    ./webpkgserver --help

    คำสั่งนี้ควรแสดงข้อมูลเกี่ยวกับการใช้งาน webpkgserver หากวิธีนี้ไม่ได้ผล ขั้นตอนแรกในการแก้ปัญหาที่ดีคือตรวจสอบว่าได้กําหนดค่า GOPATH อย่างถูกต้องแล้ว

วิธีการ

  1. ไปที่ไดเรกทอรี webpkgserver (คุณอาจอยู่ในไดเรกทอรีนี้อยู่แล้ว)

    cd /path/to/cmd/webpkgserver

  2. สร้างไฟล์ webpkgsever.toml โดยคัดลอกตัวอย่าง

    cp ./webpkgserver.example.toml ./webpkgserver.toml

    ไฟล์นี้มีตัวเลือกการกำหนดค่าสำหรับ webpkgserver

  3. เปิด webpkgserver.toml ด้วยเครื่องมือแก้ไขที่ต้องการ แล้วทําการเปลี่ยนแปลงต่อไปนี้

    • เปลี่ยนบรรทัด #AllowTestCert = false เป็น AllowTestCert = true
    • เปลี่ยนบรรทัด PEMFile = 'path/to/your.pem' ให้แสดงเส้นทางไปยังใบรับรอง PEM cert.pem ที่คุณสร้างขึ้น อย่าเปลี่ยนบรรทัดที่พูดถึง TLS.PEMFile เนื่องจากเป็นตัวเลือกการกําหนดค่าอื่น
    • เปลี่ยนบรรทัด KeyFile = 'priv.key' ให้แสดงเส้นทางของคีย์ส่วนตัว priv.key ที่คุณสร้างขึ้น อย่าเปลี่ยนบรรทัดที่กล่าวถึง TLS.KeyFile เนื่องจากเป็นตัวเลือกการกําหนดค่าอื่น
    • เปลี่ยนบรรทัด #CertURLBase = '/webpkg/cert' เป็น CertURLBase = 'data:' CertURLBase ระบุตำแหน่งที่แสดงใบรับรอง SXG ระบบจะใช้ข้อมูลนี้เพื่อตั้งค่าพารามิเตอร์ cert-url ในหัวของ SXG Signature ในสภาพแวดล้อมที่ใช้งานจริง ระบบจะใช้ CertURLBase ดังนี้ CertURLBase = 'https://mysite.com/' อย่างไรก็ตาม สําหรับการทดสอบในเครื่อง คุณสามารถใช้ CertURLBase = 'data:' เพื่อสั่งให้ webpkgserver ใช้ data URL เพื่อแทรกใบรับรองในช่อง cert-url สําหรับการทดสอบในเครื่อง วิธีนี้เป็นวิธีที่สะดวกที่สุดในการแสดงใบรับรอง SXG
    • เปลี่ยนบรรทัด Domain = 'example.org' ให้ตรงกับโดเมนที่คุณสร้างใบรับรอง หากคุณทําตามวิธีการในบทความนี้อย่างตรงไปตรงมา ค่านี้ควรเปลี่ยนเป็น example.com webpkgserver จะดึงข้อมูลเนื้อหาจากโดเมนที่ระบุโดย webpkgserver.toml เท่านั้น หากคุณพยายามดึงข้อมูลหน้าเว็บจากโดเมนอื่นโดยไม่อัปเดต webpkgserver.toml บันทึก webpkgserver จะแสดงข้อความแสดงข้อผิดพลาด URL doesn't match the fetch targets

    ไม่บังคับ

    หากต้องการเปิดหรือปิดใช้การโหลดทรัพยากรย่อยล่วงหน้า ตัวเลือกการกําหนดค่าต่อไปนี้จะเกี่ยวข้องwebpkgserver.toml

    • หากต้องการให้ webpkgserver แทรกคำสั่งสำหรับโหลดสไตล์ชีตและทรัพยากรย่อยของสคริปต์ล่วงหน้าเป็น SXG ให้เปลี่ยนบรรทัด #PreloadCSS = false เป็น PreloadCSS = true นอกจากนี้ ให้เปลี่ยนบรรทัด #PreloadJS = false เป็น PreloadJS = true

      นอกเหนือจากการใช้ตัวเลือกการกําหนดค่านี้ คุณสามารถเพิ่มส่วนหัว Link: rel="preload" และแท็ก <link rel="preload"> ลงใน HTML ของหน้าเว็บด้วยตนเอง

    • โดยค่าเริ่มต้น webpkgserver จะแทนที่แท็ก <link rel="preload"> ที่มีอยู่ด้วยแท็ก <link> ที่เทียบเท่าซึ่งจําเป็นสําหรับการดึงข้อมูลเนื้อหานี้ในรูปแบบ SXG webpkgserver จะตั้งค่าคำสั่ง allowed-alt-sxg และ header-integrity ตามที่จำเป็นเมื่อดำเนินการดังกล่าว ผู้เขียน HTML จึงไม่ต้องเพิ่มคำสั่งเหล่านี้ด้วยตนเอง หากต้องการลบล้างลักษณะการทำงานนี้และเก็บการโหลดล่วงหน้าที่ไม่ใช่ SXG ที่มีอยู่ ให้เปลี่ยน #KeepNonSXGPreloads (default = false) เป็น KeepNonSXGPreloads = true โปรดทราบว่าการเปิดใช้ตัวเลือกนี้อาจทําให้ SXG ไม่มีสิทธิ์ใช้แคช Google SXG ตามข้อกําหนดเหล่านี้

  4. เริ่ม webpkgserver

    ./webpkgserver

    หากเซิร์ฟเวอร์เริ่มต้นสําเร็จ คุณควรเห็นข้อความบันทึกต่อไปนี้ shell Listening at 127.0.0.1:8080 Successfully retrieved valid OCSP. Writing to cache in /private/tmp/webpkg

    ข้อความบันทึกอาจดูแตกต่างออกไปเล็กน้อย โดยเฉพาะอย่างยิ่งไดเรกทอรีที่ webpkgserver ใช้แคชใบรับรองจะแตกต่างกันไปตามระบบปฏิบัติการ

    หากไม่เห็นข้อความเหล่านี้ ขั้นตอนแรกในการแก้ปัญหาที่ดีคือตรวจสอบ webpkgserver.toml อีกครั้ง

    หากอัปเดต webpkgserver.toml คุณควรรีสตาร์ท webpkgserver

  5. เปิด Chrome โดยใช้คำสั่งต่อไปนี้ shell /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome \ --user-data-dir=/tmp/udd \ --ignore-certificate-errors-spki-list=`openssl x509 -noout -pubkey -in cert.pem | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | base64`

    คำสั่งนี้จะสั่งให้ Chrome ละเว้นข้อผิดพลาดเกี่ยวกับใบรับรองที่เชื่อมโยงกับ cert.pem ซึ่งช่วยให้ทดสอบ SXG ได้โดยใช้ใบรับรองทดสอบ หากเปิด Chrome โดยไม่ใช้คําสั่งนี้ การตรวจสอบ SXG ในเครื่องมือสําหรับนักพัฒนาเว็บจะแสดงข้อผิดพลาด Certificate verification error: ERR_CERT_INVALID

    หมายเหตุ

    คุณอาจต้องปรับคำสั่งนี้ให้สอดคล้องกับตำแหน่งของ Chrome ในเครื่อง รวมถึงตำแหน่งของ cert.pem หากดำเนินการอย่างถูกต้อง คุณควรเห็นคำเตือนแสดงอยู่ใต้แถบที่อยู่ คำเตือนควรมีลักษณะคล้ายกับYou are using an unsupported command-line flag: --ignore-certificate-errors-spki-list=9uxADcgc6/ho0mJLRMBcOjfBaN21k0sOInoMchr9CMY=.

    หากคำเตือนไม่มีสตริงแฮช แสดงว่าคุณไม่ได้ระบุตำแหน่งของใบรับรอง SXG อย่างถูกต้อง

  6. เปิดแท็บเครือข่ายของเครื่องมือสำหรับนักพัฒนาเว็บ จากนั้นไปที่ URL ต่อไปนี้ http://localhost:8080/priv/doc/https://example.com

    ซึ่งจะส่งคําขอไปยังอินสแตนซ์ webpackager ที่ทํางานอยู่ที่ http://localhost:8080 สําหรับ SXG ที่มีเนื้อหาของ https://example.com /priv/doc/ คือปลายทาง API เริ่มต้นที่ webpackager ใช้

    ภาพหน้าจอของแท็บเครือข่ายใน DevTools ที่แสดง SXG และใบรับรองของ SXG

    ทรัพยากรต่อไปนี้จะแสดงอยู่ในแท็บเครือข่าย

    • ทรัพยากรประเภท signed-exchange นี่คือ SXG
    • ทรัพยากรประเภท cert-chain+cbor นี่คือใบรับรอง SXG ใบรับรอง SXG ต้องใช้รูปแบบ application/cert-chain+cbor
    • ทรัพยากรประเภท document นี่คือเนื้อหาที่ส่งผ่าน SXG

    หากไม่เห็นทรัพยากรเหล่านี้ ให้ลองล้างแคชของเบราว์เซอร์ แล้วโหลด http://localhost:8080/priv/doc/https://example.com อีกครั้ง

    คลิกแท็บแสดงตัวอย่างเพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับ Signed Exchange และลายเซ็น

    ภาพหน้าจอของแท็บแสดงตัวอย่างที่แสดง SXG

แสดง Signed Exchange โดยใช้ใบรับรอง CanSignHttpExchanges

วิธีการในส่วนนี้จะอธิบายวิธีแสดง SXG โดยใช้ใบรับรอง CanSignHttpExchanges การใช้งาน SXG ในเวอร์ชันที่ใช้งานจริงต้องมีใบรับรอง CanSignHttpExchanges

วิธีการเหล่านี้เขียนขึ้นโดยสมมติว่าคุณเข้าใจแนวคิดที่อธิบายไว้ในส่วนตั้งค่า Signed Exchange โดยใช้ใบรับรองที่ลงนามด้วยตนเองเพื่อให้สั้นกระชับ

ข้อกำหนดเบื้องต้น

  • คุณมีใบรับรอง CanSignHttpExchanges หน้านี้แสดงรายชื่อ CA ที่เสนอใบรับรองประเภทนี้

  • หากไม่มีใบรับรอง คุณสามารถกําหนดค่า webpkgserver ให้ดึงใบรับรองจาก CA โดยอัตโนมัติ คุณสามารถทำตามวิธีการสำหรับสิ่งที่ควรใส่ใน webpkgserver.toml ในหน้านี้

  • แม้ว่าจะไม่บังคับ แต่เราขอแนะนําอย่างยิ่งให้คุณเรียกใช้ webpkgserver หลังเซิร์ฟเวอร์ Edge หากไม่ได้ใช้เซิร์ฟเวอร์ Edge คุณจะต้องกำหนดค่าตัวเลือก TLS.PEMFile และ TLS.KeyFile ใน webpkgserver.toml โดยค่าเริ่มต้น webpkgserver จะทํางานผ่าน HTTP อย่างไรก็ตาม เบราว์เซอร์จะถือว่าใบรับรอง SXG ถูกต้องก็ต่อเมื่อแสดงผ่าน HTTPS การกำหนดค่า TLS.PEMFile และ TLS.KeyFile จะช่วยให้ webpkgserver ใช้ HTTPS ได้ จึงแสดงใบรับรอง SXG ไปยังเบราว์เซอร์โดยตรง

วิธีการ

  1. สร้างไฟล์ PEM โดยการต่อท้ายใบรับรอง SXG ของเว็บไซต์ตามด้วยใบรับรอง CA ของเว็บไซต์ ดูวิธีการเพิ่มเติมได้ที่นี่

    PEM คือรูปแบบไฟล์ที่มักใช้เป็น "คอนเทนเนอร์" สำหรับจัดเก็บใบรับรองหลายรายการ

  2. สร้างไฟล์ webpkgsever.toml ใหม่โดยคัดลอกตัวอย่าง

    cp ./webpkgserver.example.toml ./webpkgserver.toml

  3. เปิด webpkgserver.toml ด้วยเครื่องมือแก้ไขที่ต้องการ แล้วทําการเปลี่ยนแปลงต่อไปนี้

    • เปลี่ยนบรรทัด PEMFile = cert.pem ให้ตรงกับตำแหน่งของไฟล์ PEM ที่มีเชนใบรับรองแบบเต็ม
    • เปลี่ยนบรรทัด KeyFile = 'priv.key' ให้แสดงตำแหน่งของคีย์ส่วนตัวที่สอดคล้องกับไฟล์ PEM
    • เปลี่ยนบรรทัด Domain = 'example.org' ให้แสดงถึงเว็บไซต์ของคุณ
    • (ไม่บังคับ) หากต้องการให้ webpkgserver ต่ออายุใบรับรอง SXG โดยอัตโนมัติทุกๆ 90 วัน (45 วันสำหรับ Google) ให้กำหนดค่าตัวเลือกในส่วน [SXG.ACME] ของ webpkgserver.toml ตัวเลือกนี้ใช้ได้กับเว็บไซต์ที่มีการตั้งค่าบัญชี DigiCert หรือ Google ACME เท่านั้น

  4. กำหนดค่าเซิร์ฟเวอร์ Edge ให้ส่งต่อการรับส่งข้อมูลไปยังอินสแตนซ์ webpkgserver

    คำขอหลักๆ ที่ webpkgserver จัดการมี 2 ประเภท ได้แก่ คำขอ SXG (ซึ่งให้บริการโดยปลายทาง /priv/doc/) และคำขอใบรับรอง SXG (ซึ่งให้บริการโดยปลายทาง /webpkg/cert/) กฎการเขียน URL ใหม่สำหรับคำขอแต่ละประเภทเหล่านี้จะแตกต่างกันเล็กน้อย ดูข้อมูลเพิ่มเติมได้ที่การทํางานหลังเซิร์ฟเวอร์ Edge ของส่วนหน้า

    หมายเหตุ

    โดยค่าเริ่มต้น webpkgserver จะแสดงใบรับรอง SXG ที่ /webpkg/cert/$CERT_HASH เช่น /webpkg/cert/-0QmE0gvoedn92gtwI3s7On9zPevJGm5pn2RYhpZxgY หากต้องการสร้าง $CERT_HASH ให้เรียกใช้คำสั่งต่อไปนี้ shell openssl base64 -in cert.pem -d | openssl dgst -sha256 -binary | base64 | tr /+ _- | tr -d =