Skip to main content
ユーザー向けチャット UI では、Chat XDKJavaScript/WASM パッケージ(@xdevplatform/chat-xdk)経由でブラウザー内で実行してください。アイデンティティと署名の秘密鍵はユーザーの端末に留まります。あなたのサーバー(および X)が目にするのは暗号文、公開鍵、OAuth トークンだけであり、メッセージの暗号化・署名に使う PIN や秘密鍵の素材ではありません。 このページはクライアントアプリ向けの推奨アーキテクチャです。あらゆるアプリ種別に共通する PIN と鍵の取り扱いルールについては、秘密鍵の取り扱い を参照してください。

なぜ UI アプリで WASM なのか

エンドユーザーは自分の暗号化 PIN をあなたのバックエンドに貼り付けるべきでは決してなく、あなたのバックエンドはユーザーのアイデンティティ秘密鍵を保持すべきでは決してありません。サードパーティのサーバーがユーザーの PIN やルート秘密鍵を受け取ってしまうと、その相手はユーザーが後に OAuth アクセスを取り消したあとでも、そのアイデンティティ宛にラップされた会話鍵を復号できます。クライアントサイドの WASM は、正当なアプリからこの種の失敗を避けられます。
サードパーティに PIN や秘密鍵を渡すことは、暗号化 DM のパスワードを共有するのと同じです。OAuth の切断は、アプリがすでに取得した鍵を取り消しません。可能な限り WASM を選んで鍵をブラウザーの外に出さないようにし、それができない場合はリスクを明示してください。秘密鍵の取り扱い を参照してください。

推奨アーキテクチャ

暗号処理(ブラウザー)と API トランスポート(あなたのバックエンド、またはユーザートークンを使った直接の X API 呼び出し)を分離します。 一般的なパターン(社内デモのブラウザーチャットクライアントなどで使われているもの)は次のようになります:フロントエンドで WASM + React(または類似)、そして必要に応じてブラウザーが長寿命のシークレットで api.x.com を直接叩かなくても済むよう、Next.js(または他)の API ルート内で TypeScript XDK を使用します。暗号処理は依然としてブラウザー内でのみ実行されます。

ブラウザー用パッケージのインストール

コンパイル済みの WASM エンジンは @xdevplatform/chat-xdk に同梱されており、利用者側に Rust ツールチェーンは不要です。モダンなブラウザー(SSR とコードを共有する場合は Node.js 18 以上。暗号処理はクライアントでのみ実行してください)が必要です。

セッションの流れ(PIN は一度だけ、鍵はメモリに留める)

メッセージごとに PIN を要求してはいけませんブラウザーセッションごとに一度だけアンロックし、Chat インスタンスをメモリ内に保持(モジュールシングルトン、React コンテキストなど)し、そのアンロック済みインスタンスに対して暗号化と復号を実行してください。

UX 上の期待値

アクションごとに PIN を再入力させないでください。 デモアプリでは簡便さのために unlock を繰り返し呼ぶことがあります。本番の UI では一度だけアンロックし、インスタンスをメモリに保持し、リロード、ログアウト、または lock() の後にのみ PIN を再入力させてください。

サーバーが見てよいもの

Juicebox 用のレルムトークンはユーザーの PIN ではありません。それは、特定のユーザーと鍵バージョンに対してバックアッププロトコルを認可します。すでにユーザーの OAuth コンテキストを保持しているバックエンドで発行し続けてください。

ブラウザーでのセキュアキーバックアップ

クライアントアプリは、生の鍵ファイルではなくセキュアキーバックアップ(パスコードを使う setup / unlock)を使うべきです。
  1. ユーザーの公開鍵レコード(public_key.fields=juicebox_config)から juicebox_config をロードします。
  2. createChat({ juiceboxConfig, getAuthToken }) を呼び出します。
  3. 初回:generateKeypairs → X に公開鍵を登録 → setup(pin)
  4. その後:この端末で unlock(pin)(または同じ PIN で新しい端末で)。
Chat XDK のブラウザー経路は鍵を WASM に復元し、createChat の公開サーフェスでは生の秘密鍵エクスポートを露出しません。そのため、アプリケーションの JavaScript がルート鍵バイトをページに引き出すのは推奨されません。手作りの localStorage への鍵ダンプよりも、このモデルを優先してください。 登録とアンロックの完全な手順は はじめに、概念は 暗号化入門 を参照してください。

ブラウザーのハードニングチェックリスト

  • Chat XDK はクライアントバンドルでのみ実行してください(アンロック済み鍵の SSR は不可)。
  • アンロック済み Chat インスタンスをライブセッションのシークレットとして扱ってください:window に置かない、ログに出さない、アナリティクスに送らない。
  • XSS に対策してください:CSP、dangerouslySetInnerHTML や Markdown レンダリングの慎重な扱い、依存関係の衛生管理。チャットアプリでの XSS は、鍵がネットワークに乗らなくてもメモリ内の鍵に到達できます。
  • どこでも HTTPS を使い、暗号処理を含むページを安全でないスクリプトと絶対に混在させないでください。
  • OAuth スコープは最小限を優先し、DM スコープは必要なときにのみ要求し、プロダクト UI で理由を説明してください。
  • ログアウト時には lock() / free() を呼び、インスタンスを破棄してください。
ストレージ関連の推奨事項(localStorage に置くべきでないもの、セッション永続化の考え方)は 秘密鍵の取り扱い にあります。

次のステップ

  1. 秘密鍵の取り扱い — PIN に関する警告、保管、ボットと UI アプリの比較
  2. はじめに — 完全な鍵登録と最初のメッセージ
  3. Chat XDKcreateChat、暗号化、復号の API リファレンス
  4. リアルタイムイベント — 暗号文をクライアントに配信してローカルで復号する