連携 · サイトプラットフォーム
Next.js：ルートレイアウト、ルート遷移、チェックアウト。
app/layout.tsx にタグを 1 つ入れればすべてのルートをカバーし、クライアント側のナビゲーションもページビューとして数えます。Stripe Checkout Session を作成する Route Handler では 2 行で訪問者の ID を渡せ、ミドルウェアが AI クローラーを報告します。
無料で始める
14 日間無料、カード登録は不要です。
01Tally が計測するもの
- ルートレイアウトから、アプリのすべてのルートを計測します。クライアント側のナビゲーションもページビューとして数えます。
- ページごとのエンゲージメント時間とスクロール深度、ゴール、外部サイトへのリンクのクリック。
- ミドルウェアに数行加えて報告すれば、AI クローラーも計測します。Next.js 用のスニペットは AI crawlers ページにあります。
02収益データの取得元
- Route Handler からのチェックアウトawait cookies() で _tally_vid Cookie を読み取り、tally_visitor_id として Session の metadata と subscription_data.metadata に渡します。ハンドラーのコードは Coverage ページにあります。
- 完了ページCookie なしのサイトでは、完了ページの URL に ?session_id={CHECKOUT_SESSION_ID} を付ければ、それを表示するページが売上を訪問に紐づけます。
03読み取れないもの
- プリフェッチなど、ブラウザーでページを読み込まないサーバーレンダリングのリクエストは、訪問として数えません。
- アプリストア経由のアプリ内課金は読み取りません。Route Handler で受けるその他の決済は、Payments API に送信できます。
- ミドルウェアのコードがなければ、スクリプトを実行しないクローラーは検出できません。
04スニペットを設置する
設置場所：ルートレイアウトの app/layout.tsx の <head> 内に置きます。
<head>
<script defer data-site="k3xq2mfa7twp" src="https://t.tallybyoutpost.com/script.js"></script>
</head>これはサンプルサイトのタグです。あなたのサイト ID 入りのタグは、サイトを追加するときのスニペットの手順と、そのサイトの Setup ページにあります。
- スニペットのステップに従って、app/layout.tsx の head 内にタグを貼り付けます。
- デプロイしてサイトを開くと、ライブチェックに最初の訪問が表示されます。
- Checkout Session を作成する Route Handler で、metadata に訪問者の ID を追加します。
- 必要に応じて、AI crawlers ページにあるクローラー報告用のコードをミドルウェアに追加します。
05よくある質問
App Router のクライアント側ナビゲーションも数えますか？
はい。タグがブラウザーでのルート遷移を検知するため、リロードなしのページ移動もページビューとして数えます。
サーバー側では訪問者の ID をどこから取得しますか？
ファーストパーティの _tally_vid Cookie からです。タグはこの Cookie を、Cookie モードでは常に、同意優先モードでは同意後に設定します。Route Handler では await cookies() で読み取ります。
Next.js から AI クローラーを報告できますか？
はい。ほとんどのクローラーはページのスクリプトを実行しないため、AI crawlers ページに、既知のクローラーのリクエストを Tally に報告するミドルウェア用のスニペットを用意しています。