Booster導入ガイド

目次

• 本記事の目的
• お客様に実施いただきたい内容
  • Reproプロジェクト管理画面の作成
  • ServiceWorkerファイルの設置
  • Google Tag Managerを使ったタグの設置
• タグ詳細
• Appendix

お客様に実施いただきたい内容

Reproプロジェクト管理画面の作成

• ご自身のアカウントと、アカウントに紐づくプロジェクト管理画面を作成していただきます。
• ReproAppやRepro Webをご利用中の場合でも、新たにBooster用の管理画面を作成いただく必要がございます。
• プロジェクト管理画面は本番環境用のものと、お客様のサービスに検証環境(※) があれば検証環境用のものを作成します。
  • ※既にプロジェクト管理画面をお持ちの場合はご一報下さい。
• 以下リンクより作成をお願いいたします。
  • https://app.repro.io/suppliers/sign_up
• 作成後、プロジェクト管理画面のURLをRepro担当者にお知らせください。

※検証環境は、一般のユーザーがアクセスしない、お客様のサービスの開発・検証等を目的とした環境を指します。

ServiceWorkerファイルの設置

次の「ServiceWorkerファイル」をsw.jsとして保存し、サービスのトップレベルに設置してください。 （例: https://導入対象のドメイン/sw.js ）

ServiceWorkerファイル

typeof importScripts === "function" && importScripts('https://booster.reproio.com/assets/js/sw');

配信における設定

• 本ファイルのレスポンスヘッダに Content-Type: application/javascript; charset=utf-8 が付与されるよう設定お願いします
  • ご利用のCMSなどが、ファイルの拡張子から自動で Content-Type をセットするような場合は手動での設定は不要です。また charset 部分については、サイトのエンコーディングが Shift_JIS などUTF-8以外の場合にのみ必要なものなので、該当しない場合は付与いただかなくても問題ありません。
• ServiceWorkerのURLおよびスコープについては、一度設定した後には強い必要性がない限りは変えずにそのままにしてください。

Google Tag Managerでタグの設置

本節の内容に従って作成されたお客様の環境ごとのタグをGoogle Tag Manager（以下、GTM）を介して配信します。原則、タグはデスクトップとモバイルの全ページに埋めこまれるよう設定をお願いいたします。 タグはプロジェクト管理画面の「設定」>「BOOSTER設定」より「Boosterタグ」をコピーしてお使いください。

• « Booster導入ガイド
• Boosterの動作検証 »