こんにちは、LIGフットサル部部長兼エンジニアののびすけです。
最近フットサルにあまり行けてないので、どなたか誘ってください。笑
さて先日、LIGブログが初めて月間300万PVを達成した際、社内向けに「リアルタイムでLIGブログのPV数をが表示されるサイト」をGoogle Analytics APIを利用して作ってみました。
そこで今回は、Node.jsからAPIへの接続方法とサイト作成について紹介していきたいと思います。
Google Analytics API
まずはみんな大好きGoogle Analytics(以下GA)です。
GAのAPIを使えば、ほとんど全ての情報が取れるのではないかというくらい、豊富にデータが取得できます。
代表的な項目でいえば
- リアルタイムにアクセスしている人の数
- ページ毎のPV数やページ情報
- 指定期間のサイト全体のPV数
などでしょうか。しかし今回のテーマはGAの解析ではないので、一旦ここまでの紹介とします。
実際にAPIを使ってみましょう。
それではここからが本題です。実際にAPIを使ってみましょう。
Node.jsからアクセスしてみます。
リアルタイムに情報を取得できたら良いな、ということで非同期処理が得意なNode.jsを使ってみようと思います。
事前に以下の3つを準備しましょう。
- Node.jsが動く環境
（Node.jsのインストールや使い方などはこちらの記事「いまアツいJavaScript！ゼロから始めるNode.js入門〜5分で環境構築編〜」を参考にしてください。） - Google Analyticsを利用しているユーザーアカウント
- Google AnalyticsのビューID
ちなみにビューIDとは、旧プロファイルIDのことです。GAのマイページなどのURLからも調べることができます。
▼参考：
【Googleアナリティクスの「プロファイルID」の場所はここにあります】「UA-xxx」ってやつじゃないIDのことです – 今村だけがよくわかるブログ
http://www.imamura.biz/blog/google/13401
開発スタート。超カンタンです！
npmでいい感じのモジュールが公開されていたので使ってみます。このモジュールのおかげでとても簡単にAPIアクセスできます。
- GAのデータ
-
GAにはDimentionsとMetricsという指標がありますが、今回はMetricsだけ使ってみます。このモジュールでDimentionsも取得できるのですが、詳しくはモジュールのリポジトリページを参照してください。
▼参考：
Googleアナリティクス：Dimensions（ディメンション）とMetrics（マトリクス） – Analytics Analyze – GoogleAnaltyics | アクセス解析
1. node-googleanalyticsのインストール
まずは任意のディレクトリにモジュールをインストールします。
$ npm install node-googleanalytics▼参考：
node-googleanalytics - GitHubhttps://github.com/ncb000gt/node-googleanalytics
2. 実際にGAのデータにアクセスするコードを書く
わりとサンプルコードのままです。モジュールをインストールしたディレクトリに
ga.jsを作って記述してみましょう。指定期間のPVを取得してみましょう。
var GA = require('googleanalytics'), config = { "user": "①ユーザー名", "password": "②パスワード" }, ga = new GA.GA(config); ga.login(function(err, token) { var options = { 'ids': 'ga:③GAのビューID', 'start-date': '2014-10-01', //期間を指定 'end-date': '2014-10-09', //期間を指定 'metrics': 'ga:pageviews', }; ga.get(options, function(err, entries) { console.log(JSON.stringify(entries)); }); });
- 1. Googleアカウント（ユーザー名とパスワード）
- 2. Google AnalyticsのビューID（旧プロファイルID）
3. 実行してみる
$ node ga.js [{"metrics":[{"ga:pageviews":1003454}],"dimensions":[{}]}]とれました！
今月のLIGブログの現時点（2014/10/9）までのPVは100万3454みたいですね。
超カンタンっすね！
最後に実際のGA画面を見て、この数値が正しいかどうかを検証してみましょう。
あってました！
応用: 独自に作るサイトにこの情報を埋め込んでみます
ではWebページにPV数を表示させてみます。
先ほどのファイルに変更を加え、httpモジュールでサーバを立ち上げてみましょう。var GA = require('googleanalytics'); var http = require('http'); var port = 3333, config = { "user": "**************", "password": "***********" }, ga = new GA.GA(config); ga.login(function(err, token) { var options = { 'ids': 'ga:**********', 'start-date': '2014-10-01', 'end-date': '2014-10-09', 'metrics': 'ga:pageviews', }; ga.get(options, function(err, entries) { var pv = entries[0].metrics[0]["ga:pageviews"]; http.createServer(function (request, response){ response.writeHead(200, {'Content-Type': 'text/plain'}); response.end('Hello World\n' + pv); }).listen(port); console.log('Server running at http://127.0.0.1:' + port); }); });こんな感じで記述して実行してみましょう。
$ node ga.js Server running at http://127.0.0.1:3333 (待機状態になります。)この状態で http://localhost:3333 にアクセスしてみます。
表示されました！
これで独自のWebサイト上にGAの情報を載せることができました。
おまけ：フロントエンドの人に頼りました
僕のほうでバックエンドを組んだ後に、フロントエンドエンジニアの長であるハカセ（先生）に魔法をかけて貰いました。
そして、わずか2時間後....!
なんということでしょう。 匠は(ryちなみにこちらのサイトは、9月にLIGブログが初めて300万PVを達成したときに実際に利用しました。
LIGブログのPV数が現在どれくらいになっているのかは一部の社員しか把握していなかったので、この仕組みで300万PVまでのカウントダウンパブリックビューイング的な試みができ、みんなで盛り上がることができました。まとめ
以上のような流れで、Google Analytics APIの使い方と事例を紹介してみました。
Google Analytics APIへのアクセス方法などは調べてみても、あまり記事が見つからず、なかなか難しいと思います。（実際僕もそうでした。笑）
今回の記事が参考になれば幸いです。次は350万PV記念だったり、400万PV記念のときに向け、何か作りたいと思っています。
そのときが早くきて欲しいですね。それでは！
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
