使用 CLI 上傳自訂 UI 資產
開發自訂登入 UI 後，你可以將其部署到 Logto Cloud，為你的租戶使用者提供服務。如我們在「Bring your UI」文檔中所介紹的，你可以在 Logto Console 上傳壓縮的 UI 資產來實現這一點。
這裡我們提供另一種選擇，使用 CLI 命令將你的 UI 資產部署到 Cloud，這在你想將部署過程整合到 NPM 腳本或 CI/CD 管道時會很有用。
指導說明
備註:
假設你的自訂登入 UI 資產已建置在 /path/to/your/custom/ui/dist 目錄中。
部署命令將自動壓縮你的 UI 資產，將其上傳到 Logto Cloud，並將自訂 UI 設定為你的租戶使用者的登入體驗。
先決條件
由於此命令與 Logto Management API 互動，因此需要一個機器對機器應用程式來驗證請求。請參閱此文檔以了解 Logto Management API 是什麼以及如何建立具有所需權限的機器對機器應用程式。
命令選項
--help 顯示幫助
--version 顯示 CLI 版本
--auth 你的 Logto M2M 應用程式的驗證憑證。例如：<app-id>:<app-secret>
--endpoint 指向你的 Logto Cloud 實例的 Logto endpoint URI。例如：https://<tenant-id>.logto.app/
--path, --experience-path 你的自訂登入體驗資產的本地資料夾路徑。
--resource, --management-api-resource Logto Management API 資源標示符。若使用自訂網域則必填。
--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
如果你使用自訂網域作為 Logto endpoint，則必須指定額外選項 --management-api-resource（或 --resource）。
由於 Logto Management API 資源始終固定為 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
注意：
- 使用預設 Logto 網域時可以省略此選項，因為 CLI 可以自動推斷資源。
- 使用自訂網域或預設 Logto 網域作為 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
支援的環境變數
部署命令也支援環境變數，並會自動將它們映射到相應的選項。
所有支援的環境變數如下所示，前綴為 LOGTO_。
| 環境變數 | CLI 選項 |
|---|---|
| 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 |
使用環境變數
- 你可以在 CLI 根目錄或 CLI 所在的任何父目錄中建立
.env文件。
.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
- 或者，在執行命令時直接指定這些環境變數。
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