Google Analytics Embed APIのチュートリアルをRailsで試してみた
Google Analytics は、Web サービス構築に携わる皆様ならご利用の方も多いと思います。そんな中、管理ツールなどで一元管理してみたいっ！という要望をもらうエンジニアも多いのではないでしょうか。
今回は、Google Analytics APIの中でも手に付けやすいEmbed APIのチュートリアルをやってみました。意外と日本語の情報が少なかったので共有します。今回の手順は、HTMLが動くWebサーバーであればどのプログラミング言語でも適用できます。
Google Analytics API 概要
Google Analyticsは、以下のパーツからなります。
- Collection – データを収集する。おなじみのga.jsなどです。
- Configuration – データをどう扱うかの設定をする。
- Processing – Configrationの設定をつかってデータを処理する。
- Reporting – Processingで生成されたデータを可視化する。
APIは、ConfigurationとReportingの部分で用意されているようです。今回ご紹介するのは、Reporting APIの一つであるEmbed APIのチュートリアルです。
Embed API
Embed APIの用途は、デモサイトを見るのが一番早いです。
例えば 1. Basic Dashboard にアクセスをして、Google Analyticsを利用しているアカウントでログインすると、以下のようにセッション推移のグラフを表示できます。（このブログのSession数が少ないのはさておき。。）
Google Analytics Embed API チュートリアル
このチュートリアルでは、以下のような画面を出力するアプリを作成するのがゴールです。
1. Client ID（APIへのアクセスキー）の作成
APIを利用する前に、まずClient IDを作成する必要があります。
前提として、Google APIのアクセスポリシーとしては、以下のようになっています。
- 公開データへのアクセス : API key （Client ID）でアクセス可能
- 非公開データへのアクセス : OAuth 2.0 認証が必要
今回利用するデータは、サイトへのSession数といったプライベートな情報になります。なので閲覧者はグラフを表示する前に、画面上のログインボタンからOAuth 2.0 認証（Googleへのログイン）をする必要があります。（アクセストークンを取得してアプリに保持すれば、その認証プロセスも省けそうですが、今回はそれはやりません。）
手順は下記です。
こちらにアクセスをして、プロジェクトを作成する
プロジェクト作成後、Analytics API をONにする
クライアントIDを作成する
今回は、localhost:3000でEmbed APIを動かすアプリを作ったので、AUTHORIZED JAVASCRIPT ORIGINSをlocalhost:3000にします。
2. 認証画面の設定に、EMAIL ADDRESSとPRODUCT NAMEを設定する
ログインボタンを押した際にでるポップアップのOAuth 認証画面の設定です。
こちらを設定しないと、閲覧者が認証をしても、下記のようなエラーになってしまいます。
invalid_client
no application name
3. アプリのViewにチュートリアル用HTMLをはりつける
作成したアプリのViewにチュートリアル用HTML(+ Javascript)をはりつけ、CLIENT_IDを先ほど作成したClient IDに置き換えれば完了です。
// Step 3: Authorize the user.
var CLIENT_ID = 'Insert your client ID here';
Railsのソースは、GitHubにUPしてみました。（今後拡充していく予定です）
チュートリアル完成後の画面
WEBrickでRailsを起動させ、ブラウザでlocalhost:3000 にアクセスして、上記の流れで作成したアプリを確認してみます。
初期画面はAccess Google Analyticsのボタンだけです。
ボタンを押すとOAuth認証のポップアップがでます。
承認すると、最初に紹介した画面を見ることができました。
以上、今回は初歩的なところをまずやってみました。
今後は徐々にこの手のネタを展開させていく予定です。
