認証済みページに表示

自社サービスのログイン情報を利用して、埋め込みチャットに便利な回数制限を加えたり、高速化をすることができます。

前提条件

カスタムトークンの発行のドキュメントのエンドポイントの実装が完了しているものとします。

自社サービスの認証と連携する

作成したエンドポイントをuserTokenEndpointで指定します。
hisho-clientはここから、ユーザーを識別するトークンを自動取得するようになります。

import { HishoChatWidget } from "hisho-client/next";

<HishoChatWidget
  auth={{
    clientToken: process.env.NEXT_PUBLIC_HISHO_CLIENT_TOKEN!,
  }}
  userTokenEndpoint="/api/hisho/user-token"
/>

Good to know

作成したエンドポイントがフロントエンドと同じドメインにある場合は相対パスで指定することができます。異なるドメインのAPIサーバーに実装した場合はhttps://から始まる絶対パスで指定します。

Bot検証をオフにする

hisho-clientの埋め込みチャットでは、Botによる操作ではないか定期的に検証することで不正利用から保護しています。一方、認証済みの保護されたページに表示する場合、この保護は過剰で待ち時間を発生させ、UXを低下させることがほとんどです。

userTokenEndpoint を指定して、自社サービスの認証と連携している場合に限り disableTurnstile を指定することにより、Bot検証を省略できます。

<HishoChatWidget
  auth={{
    clientToken: process.env.NEXT_PUBLIC_HISHO_CLIENT_TOKEN!,
  }}
  userTokenEndpoint="/api/hisho/user-token"
  disableTurnstile
/>