Reselfit Docs

認証済みユーザーの状態を Reselfit Plugin に安全に共有する方法

userToken とは

userToken は Reselfit Plugin に「このユーザーは誰か」を安全に伝えるための短命 JWT です。

userId をそのまま HTML に置く運用だと改ざん・なりすましを防げないため、本番環境では userToken をセットする運用を強く推奨します。

管理コンソールで署名シークレットを発行

Reselfit 管理コンソールの セキュリティ > userToken 署名シークレット では、コンソールから userToken 証明シークレットをいつでも発行できます。以下の情報が表示されるので、コピーして自社バックエンドへ登録してください。

シークレット: userToken の署名に利用する HS256 用シークレット。
kid: シークレットを識別するキー ID。シークレットをローテーションするときの差し替え管理が容易になります。

注意: userToken の証明処理は必ずサーバーサイドで実行し、userToken 署名シークレット は安全に保管してクライアントコードから参照されないようにしてください。

1 アカウントで複数のシークレットを同時に管理でき、不要になったものは無効化（または削除）してください。kid の設定は任意ですが、管理コンソールでも kid 単位で一覧・無効化できるため、kid 付きで管理するとシークレットの切り替えが安全に行えます。

サーバーで userId を JWT に変換する

シークレットは必ずサーバーサイドだけに置き、userId を JWT に変換して userToken としてフロントエンドへ渡します。以下はnodejs環境で jose を使ったサンプルです。

import { SignJWT } from 'jose'

const secretKey = new TextEncoder().encode(process.env.USER_TOKEN_SECRET)
const kid = process.env.USER_TOKEN_KID // 任意だが設定を推奨

export async function issueUserToken(userId: string) {
  return await new SignJWT({ user_id: userId })
    .setProtectedHeader({ alg: 'HS256', kid: kid || undefined })
    .setIssuedAt()
    .setExpirationTime('1h')
    .sign(secretKey)
}

kid を設定できない事情がある場合でも署名は実行できますが、ローテーションのたびに利用者へ影響が出るため可能な限り kid も同梱してください。
有効期限は 1 時間以内を推奨します（短すぎると毎回再発行が必要になるため、ユースケースに応じて数分〜数時間で調整）。
署名済み token はユーザーごとに最新のものを配布し、無効化した token を使い回さないようにしてください。

userTokenの設置例

HTML の埋め込み設定で userId / userToken を設定する

reselfit-plugin-script-config の JSON で渡す場合は以下のように設定します。

<script type="application/json" id="reselfit-plugin-script-config">
{
  "item": {
    ...
  },
  "userId": "{YOUR_USER_ID}",
  "userToken": "{YOUR_USER_IDをjwt証明した値}"
}
</script>

実際の例

<script type="application/json" id="reselfit-plugin-script-config">
{
  "item": {
    ...
  },
  "userId": "demo-user-001",
  "userToken": "eyJhbGciOiJIUzI1NiIsImtpZCI6InN0a25fc29vYjc3NzZybHVlM2J4ZzRjNHR6azIzIn0.eyJ1c2VyX2lkIjoiZGVtby11c2VyLTAwMSIsImV4cCI6MTc2NTU0MjQ1OH0.YUh1ha2K5OP9PJoLxceSS3pT_AlzlrLYVgQEiQ7GmGk"
}
</script>

Playground は HS256 シークレットを直接入力して試せるデモですが、本番でもバックエンド経由で署名する運用を推奨します。userToken が失効した場合はバックエンド経由で再発行し、reselfit-plugin-script-config の JSON を更新してから Plugin を再初期化します。

'boot' JavaScript API で userId / userToken を設定する

boot JavaScript APIので以下のように設定することで、boot時に userId, userTokenを設定できます。

<script>
  window.Reselfit('boot', {
    userId: "{YOUR_USER_ID}",
    userToken: "{YOUR_USER_IDをjwt証明した値}"
  })
</script>