Logto Cloud はまだ構築中ですが、基盤である Logto OSS にいくつかの新機能を紹介したいと思います。これは一般提供前の最後のバージョンになります。注目すべき更新内容: - インフラストラクチャのリファクタリングとセキュリティの強化 - サインイン体験にスマートインプットとカスタマイズ可能なCSSを追加 - オープンスタンダードコネクタ (SAML, OIDC, OAuth 2.0) - 新しい言語サポートそれでは、何が含まれているか見てみましょう！ ## 💥 破壊的変更 💥 ### 通常ユーザーと管理者の分離 Logto は通常のユーザーと管理者、そしてウェブコンソールを同じポートで提供していました。高レベルのセキュリティを維持し続ける一方で、これらのコンポーネントを2つのセパレートされたパートに分け、データを分離して柔軟なインフラを提供することが望ましいです。 ![image1](https://user-images.githubusercontent.com/14722250/221365507-6f20a804-1059-4933-9b88-df1244ab900b.png) このバージョンから、Logto はデフォルトで2つのポートをリッスンします。1つは通常のユーザー (`3001`)、もう1つは管理者 (`3002`) 用です。

‼️ 詳細を見るにはクリックしてください

- 通常ユーザーに対する変更はありません。適応は不要です。 - 管理者ユーザー向け: - デフォルトの管理コンソールURLは `http://localhost:3002/console` に変更されました。 - 管理ポートを変更するには、環境変数 `ADMIN_PORT` を設定します。例えば、`ADMIN_PORT=3456`。 - 管理者用のカスタムエンドポイントを指定するには、環境変数 `ADMIN_ENDPOINT` を設定します。例: `ADMIN_ENDPOINT=https://admin.your-domain.com`。 - `ADMIN_DISABLE_LOCALHOST=1` をセットし、`ADMIN_ENDPOINT` を未設定にすることで管理者エンドポイントを完全に無効化できるようになりました。 - 管理コンソールや管理者ユーザーデータは通常ユーザーエンドポイント (localhost や環境変数に指定された `ENDPOINT` を含む) からアクセスできません。 - 管理コンソールはもう管理ユーザーの監査ログを表示しません。しかし、これらのログは引き続きデータベースに存在し、Logto は管理ユーザーログを挿入し続けます。ただし、それらを調べる便利なインターフェースはありません。 - データ分離により、ダッシュボードの数字がわずかに減少する可能性があります (管理者は除外されます)。 - Logto Management API のリソースインジケーターが `https://api.logto.io` から `https://default.logto.app/api` に変更されました。

以前のバージョンからアップグレードする場合は、[データベース変更コマンド](https://docs.logto.io/docs/tutorials/using-cli/database-alteration) を通常通り実行するだけで、残りはお任せください。実際のところ、私たちはPostgresの強力な機能であるRow-Level Securityを使用して管理者とユーザーのデータを分離しています。 ### CORSポリシー - `ADMIN_ENDPOINT` が指定されていない場合、`localhost:[admin-port]` は Logto でクロス・オリジン・リソース・シェアリング(CORS)を行うことが許可されます。 - `ADMIN_ENDPOINT` が指定された場合、そのオリジンからの要求のみが許可されます。 ## 🔐 セキュリティアップデート以前のバージョンでは、新しいパスワードが登録または変更される際、パスワードは暗号化されてデータベースに挿入される前に、監査ログにプレーンテキストで保存されていました。今回のバージョンでは、監査ログに挿入される前にパスワードフィールドを完全にマスクするようにプロセスを更新しました。セキュリティとコンプライアンスの向上のために、すべてのパスワードを監査ログから削除するか、パスワードを含むすべてのログを削除することを強くお勧めします。この問題やデータの削除について質問がある場合は、メールまたはDiscordでお気軽にお問い合わせください。 ## 🧑‍🚀 機能アップデート ### 💡 サインイン体験向けスマートインプットユーザー名や電話番号、メールアドレスの伝統的な入力フィールドを1つのインテリジェントな入力ボックスに統合しました:

この高度な入力ボックスは、入力している文字のタイプを自動的に識別し、例えば `@` 記号や連続した数字など、関連するエラーフィードバックを提供します。サインインプロセスを簡略化することで、ユーザーは希望のログイン方法のためにどのボタンをクリックすべきか迷うことなく時間を無駄にする必要がなくなります。これにより、エラーのリスクを軽減し、滑らかなサインイン体験を実現します。 ### 🎨 サインイン体験でのCSSカスタマイズユーザーのサインイン体験の改善に多くの努力を注ぎ、UIにブランドカラーオプションを提供しました。しかし、UI要件の微調整は予測不可能な場合があります。Logtoはカスタマイズの最良のオプションを模索していますが、開発をブロックしないプログラム可能な方法を提供したいと思います。現在、Management API `PATCH /api/sign-in-exp` を使用して、ボディ `{ "customCss": "任意の文字列" }` でサインイン体験のためにカスタマイズされたCSSを設定することができます。そのスタイルが優先順位が高ければ、上書きできるはずです。例えば、サインインページに **_Night City_** の雰囲気を与えたい場合は、このCSSを試してみてください:

CSSを展開してプレビューを見るにはクリックしてください

```css @font-face { font-family: 'Rock Salt'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/rocksalt/v18/MwQ0bhv11fWD6QsAVOZrt0M6p7NGrQ.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Share Tech'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/sharetech/v17/7cHtv4Uyi5K0OeZ7bohU8H0JmBUhfrE.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } #app * { font-family: 'Share Tech'; letter-spacing: 0.5px; } #app > div[class$='viewBox'] { background-image: url(https://silverhand.io/assets/v-in-nc.jpg); background-size: cover; } #app main[class$='main'] { background-image: url(https://silverhand.io/assets/gentle-universe.png); background-size: cover; opacity: 0.98; min-height: initial; padding: 24px; padding-bottom: 72px; border-radius: 12px; } #app main[class$='main'] img[class$='logo'] { content: url(https://silverhand.io/assets/cyberpunk-2077.png); margin: -20px 0 -12px; height: 160px; } #app main[class$='main'] div[class$='headline'] { visibility: hidden; height: 60px; } #app main[class$='main'] div[class$='headline']:before { content: 'Night City へようこそ'; visibility: visible; display: block; font-family: 'Rock Salt'; font-style: italic; line-height: 60px; font-size: 20px; color: rgba(245, 250, 255, 0.6); padding: 0 20px; } #app form div[class$='inputField'] > div { outline: none; border: none; border-radius: 4px; } #app form div[class$='inputField'] > div > input, #app form div[class$='inputField'] div[class$='countryCodeSelector'] { background: initial; background-color: #453f67; font-family: 'Share Tech'; letter-spacing: 0.5px; font-size: 16px; font-weight: 600; } #app button { font-weight: 600; font-size: 16px; border-radius: 4px; } #app button[type='submit'] { background: linear-gradient(270.84deg, #2fd6fb -24.55%, #6369fc 44.33%, #a741eb 119.2%), #5d34f2; } ``` ![custom-css-preview](https://user-images.githubusercontent.com/14722250/221394786-4ae77638-8f35-4791-afae-8ab6a314dbf8.jpg) _"焼けるべき都市がある！"_

Logto は CSS モジュールを使用しているため、DOM 要素の `class` プロパティにハッシュ値が付いている場合があります (例: `

` に `vUugRG_container`)。これをオーバーライドするために、`$=` CSS セレクターを使用して、指定された値で終わる要素をマッチさせることができます。この場合、`div[class$=container]` とする必要があります。 ### 🔗 優れた設定インターフェースを持つオープンスタンダードコネクタ Logto は、外部IDプロバイダーとの統合のためにソーシャルコネクタを作成するために、標準プロトコル (SAML, OIDC, OAuth 2.0) に対応しています。各プロトコルは複数のソーシャルコネクタを作成でき、アクセスニーズにより大きなコントロールを提供します。さらに、SAMLコネクタの設定インターフェースを最適化しました。試してみて、感想をお知らせください！ ### 📄 新しい言語ロシア語翻訳を追加しました。(クレジット [@evist0](https://github.com/evist0)) ## 🎉 新しい貢献者 - [@Alanimdeo](https://github.com/Alanimdeo) さんが初めて貢献しました [#3064](https://github.com/logto-io/logto/pull/3064) - [@gadkins](https://github.com/gadkins) さんが初めて貢献しました [#3032](https://github.com/logto-io/logto/pull/3032) - [@evist0](https://github.com/evist0) さんが初めて貢献しました [#3158](https://github.com/logto-io/logto/pull/3158) - [@muratgozel](https://github.com/muratgozel) さんが初めて貢献しました [#3203](https://github.com/logto-io/logto/pull/3203) ありがとうございました！