อัปโหลด UI assets แบบกำหนดเองด้วย CLI

หลังจากที่คุณพัฒนา UI ลงชื่อเข้าใช้แบบกำหนดเองเสร็จแล้ว คุณสามารถนำไปใช้งานบน Logto Cloud เพื่อให้บริการแก่ผู้ใช้ tenant ของคุณ อย่างที่ได้แนะนำไว้ในเอกสาร "นำ UI ของคุณมาใช้" คุณสามารถทำได้โดยอัปโหลดไฟล์ UI ที่บีบอัด (zip) ผ่าน Logto Console

ที่นี่ เรามีอีกทางเลือกหนึ่งในการนำ UI assets ของคุณขึ้น Cloud ด้วยคำสั่ง CLI ซึ่งจะมีประโยชน์เมื่อคุณต้องการผสานกระบวนการ deploy เข้ากับสคริปต์ NPM หรือ pipeline CI / CD

คำแนะนำ

บันทึก:

สมมติว่าคุณมีไฟล์ UI ลงชื่อเข้าใช้แบบกำหนดเองที่สร้างเสร็จแล้วอยู่ในไดเรกทอรี /path/to/your/custom/ui/dist

คำสั่ง deploy จะ zip ไฟล์ UI ของคุณโดยอัตโนมัติ อัปโหลดไปยัง Logto Cloud และตั้งค่า UI แบบกำหนดเองเป็นประสบการณ์การลงชื่อเข้าใช้สำหรับผู้ใช้ tenant ของคุณ

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

เนื่องจากคำสั่งนี้ต้องโต้ตอบกับ Logto Management API จึงจำเป็นต้องมีแอป machine-to-machine เพื่อใช้ในการยืนยันตัวตนของคำขอ ดูรายละเอียดได้ที่ เอกสารนี้ เพื่อเรียนรู้ว่า Logto Management API คืออะไร และวิธีสร้างแอป machine-to-machine พร้อมสิทธิ์ที่จำเป็น

ตัวเลือกของคำสั่ง

--help                                 แสดงวิธีใช้
--version                              แสดงเวอร์ชัน CLI
--auth                                 ข้อมูลรับรองของแอป Logto M2M ของคุณ เช่น <app-id>:<app-secret>
--endpoint                             URI ปลายทาง Logto ที่ชี้ไปยัง Logto Cloud instance ของคุณ เช่น https://<tenant-id>.logto.app/
--path, --experience-path              พาธโฟลเดอร์ในเครื่องของไฟล์ UI ลงชื่อเข้าใช้แบบกำหนดเองของคุณ
--resource, --management-api-resource  ตัวบ่งชี้ทรัพยากร Logto Management API จำเป็นหากใช้ custom domain
--verbose                              แสดงผลลัพธ์แบบละเอียด [ค่าเริ่มต้น: false]

รันคำสั่ง

สมมติว่า app ID ของคุณคือ foo app secret คือ bar และ tenant ID คือ baz

npx @logto/tunnel deploy --auth foo:bar --endpoint https://baz.logto.app --experience-path /path/to/your/custom/ui/dist

หากคุณใช้ custom domain สำหรับ Logto endpoint จะต้องระบุออปชัน --management-api-resource (หรือ --resource) เพิ่มเติม

โดย Logto Management API resource จะถูกกำหนดตายตัวเป็น https://<tenant-id>.logto.app/api เสมอ คุณสามารถรันคำสั่งดังนี้:

npx @logto/tunnel deploy --resource https://baz.logto.app/api --auth foo:bar --endpoint https://your.custom.domain --experience-path /path/to/your/custom/ui/dist

หมายเหตุ:

1. ตัวเลือกนี้สามารถละเว้นได้เมื่อใช้ Logto domain เริ่มต้น เพราะ CLI จะอนุมาน resource ให้โดยอัตโนมัติ
2. ไม่ว่าจะใช้ custom domain หรือ Logto domain เริ่มต้นเป็น endpoint ก็จะได้ผลลัพธ์เหมือนกัน

หรือหากคุณมีไฟล์ zip อยู่แล้วและต้องการใช้งานโดยตรง สามารถระบุออปชัน --zip-path ได้

npx @logto/tunnel deploy --auth foo:bar --endpoint https://baz.logto.app --zip-path /path/to/your/custom/ui/dist.zip

ตัวแปรสภาพแวดล้อมที่รองรับ

คำสั่ง deploy รองรับการใช้ตัวแปรสภาพแวดล้อม (environment variables) และจะจับคู่กับออปชันที่เกี่ยวข้องโดยอัตโนมัติ

ตัวแปรสภาพแวดล้อมที่รองรับทั้งหมดจะแสดงด้านล่าง โดยมีคำนำหน้า LOGTO_

Environment variable	CLI option
LOGTO_AUTH	--auth
LOGTO_ENDPOINT	--endpoint
LOGTO_EXPERIENCE_PATH	--experience-path
LOGTO_PATH	--path
LOGTO_MANAGEMENT_API_RESOURCE	--management-api-resource
LOGTO_RESOURCE	--resource
LOGTO_ZIP_PATH	--zip-path

การใช้ตัวแปรสภาพแวดล้อม

1. คุณสามารถสร้างไฟล์ .env ในไดเรกทอรี root ของ CLI หรือไดเรกทอรีแม่ใด ๆ ที่ CLI อยู่

.env

LOGTO_AUTH=foo:bar
LOGTO_ENDPOINT=https://your.custom.domain
LOGTO_EXPERIENCE_PATH=/path/to/your/custom/ui/dist
LOGTO_RESOURCE=https://baz.logto.app/api

จากนั้นรันคำสั่งโดยไม่ต้องระบุออปชัน

npx @logto/tunnel deploy

2. หรือจะระบุตัวแปรสภาพแวดล้อมเหล่านี้โดยตรงขณะรันคำสั่งก็ได้

LOGTO_AUTH=foo:bar LOGTO_ENDPOINT=https://your.custom.domain LOGTO_EXPERIENCE_PATH=/path/to/your/custom/ui/dist LOGTO_RESOURCE=https://baz.logto.app/api npx @logto/tunnel deploy