このページの内容

ウェブ解析を導入する

Markdown

1 行の HTML または npm を使用して Glossia web SDK をサイトに追加し、ローカライゼーションシグナルの収集を開始します。

このガイドでは、サイトドメインがプロジェクトの分析設定で構成済みの Glossia プロジェクトがあることを前提としています。収集対象はそのドメインによって識別されるため、コピーするキーやシークレットはありません。

オプション A: script タグ

次のスニペットをすべてのページに追加します。可能であれば <head> 内に配置してください。

<script defer data-domain="example.com" src="https://cdn.glossia.ai/web.js"></script>

ソフトウェア開発キットは自動的に初期化され、読み込み時にページビューを送信し、シングルページアプリケーション内のクライアント側ナビゲーションで発生する以降のページビューも記録します。data-domain を省略すると、デフォルトで window.location.hostname が使用されるため、単一ドメインのサイトでは指定する必要はありません。収集エンドポイントをセルフホストするには、data-endpoint="https://collect.your-host.com" を追加します。

オプション B: npm

パッケージをインストールします。

npm install @glossia/web

アプリケーションのエントリーポイントで一度だけ初期化します。

import glossia from "@glossia/web";



glossia.init();

domain は window.location.hostname から推測されるため、ソフトウェア開発キットはサイトに登録されたプロジェクトに対してデータを記録します。上書きするには { domain: "example.com" } を渡します。たとえば、ステージング環境のオリジンから本番環境と同じプロジェクトへイベントを送信できます。

サインアップなどのカスタムイベントを記録するには、次のようにします。

glossia.track("signup");

動作を確認する

  1. ブラウザーでサイトを開きます。
  2. ネットワークタブを開き、/api/analytics/events への POST リクエストが 202 Accepted を返すことを確認します。
  3. 1 分以内に、ページビューがプロジェクトの分析ダッシュボードに表示されます。

収集される情報

ブラウザーは、ページの URL、参照元、navigator.languages、タイムゾーン、画面幅、およびタブごとのセッション識別子を送信します。サーバーは GeoIP に基づく国情報を追加し、プロジェクトの対象言語に対するローカライゼーションのギャップを算出します。Cookie は設定されず、フィンガープリント処理も行われません。