1. kzk9

    No comment

    kzk9
Changes in body
Source | HTML | Preview
@@ -1,108 +1,114 @@
[こちらの記事](http://qiita.com/repeatedly/items/df4a3623a78f3e063a34)で紹介されているように、Treasure Dataにデータを入れる際はTreasure Agent (or Fluentd)を使うのが一般的です。
- http://www.treasuredata.com/jp/
しかし、Treasure Dataはその他にもデータを簡単に収集する方法を色々と提供しています。その内の1つが**Treasure Data JavaScript SDK**です。
これはSite CatalystやGoogle Analyticsと同じように、WebサイトにJavaScriptのタグを貼る事で、サイトを訪れたビジターの情報を簡単にトラッキングする事ができます。
多くのWebサービスで1x1ピクセルの画像ファイルを使用したユーザートラッキングを行っていますが、それと同等の事が数分で実装できます。サーバーを用意する必要も、面倒を見る必要も有りません、受け取り側はTreasure Dataが全て面倒を見ます。
Treasure DataのJavaScript SDKを使うメリットは、簡単に生ログデータにアクセス出来るところです。もちろん他のサービスでも生ログにはアクセス出来るのですが、非常に手間がかかったりコストが高かったりします。
それでは実際に使い方を見て行きましょう。
+## ビデオチュートリアル
+
+こちらのビデオで実際の設定方法を見ることができます。
+
+<center><iframe width="640" height="440" src="//www.youtube-nocookie.com/embed/0bbxUzPKH3E?rel=0&amp;theme=light&amp;modestbranding=1&amp;showinfo=0" frameborder="1" allowfullscreen></iframe></center>
+
## Step 1: JavaScript SDK のインストール
以下のスクリプトを < head ></ head> タグの間に入れてください。
```js
<!-- Treasure Data -->
<script type="text/javascript">
!function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","set","trackEvent","trackPageview","ready"],n=0;n<s.length;n++){var i=s[n];e[t].prototype[i]=r(i)}var a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src=("https:"===document.location.protocol?"https:":"http:")+"//s3.amazonaws.com/td-cdn/sdk/td-1.2.0.js";var c=document.getElementsByTagName("script")[0];c.parentNode.insertBefore(a,c)}}("Treasure",this);
</script>
```
*こちらは2014年10月14日付け最新バージョンのv1.2.0を使用しています。最新バージョンは[こちら](http://docs.treasuredata.com/articles/javascript-sdk)で確認して下さい。
## Step 2: 初期化とページビューのトラッキング
以下のコードを</ body>の前に入れて下さい。APIキーの取得は[こちら](https://console.treasuredata.com/users/current)から行えます。
```js
<script type="text/javascript">
// Configure an instance for your database
var td = new Treasure({
host: 'in.treasuredata.com',
writeKey: 'YOUR_WRITE_ONLY_APIKEY_IS_HERE',
database: 'test_database'
});
// track pageview information to 'pageviews' table
td.trackPageview('pageviews');
</script>
```
これで完了です。コンソールから、データが入っているのを[確認](https://console.treasuredata.com/databases)して下さい。デフォルトでは以下の情報がロギングされます。
- td_version – td-js-sdk’s version
- td_client_id – client’s uuid
- td_charset – character set
- td_language – browser language
- td_color – screen color depth
- td_screen – screen resolution
- td_viewport – viewport size
- td_title – document title
- td_url – document url
- td_host – document host
- td_path – document pathname
- td_referrer – document referrer
- td_ip – request IP (server)
- td_browser – client browser (server)
- td_browser_version – client browser version (server)
- td_os – client operating system (server)
- td_os_version – client operating system version (server)
デフォルトのフィールドに追加して付加情報(ユーザーID等)をつける場合は、以下のようにset関数を使用します。
```js
// track pageview information to 'pageviews' table
td.set('pageviews', {foo: 'foo', bar: 'bar'});
td.trackPageview('pageviews');
```
# 高度な使い方
Treasure Data JavaScript SDKではその他にも様々な関数を提供しています。例えばアプリケーション内のイベントはtrackEvent関数でトラックする事が出来ます。API一覧は[こちら](https://github.com/treasure-data/td-js-sdk)から。
```js
var buttonEvent2 = function () {
td.trackEvent('button', {
number: 1
});
// doButtonEvent(1);
};
```
# まとめ
Treasure Data JavaScript SDKの使い方を紹介しました。Webサイトの生ログを活かして様々なマーケティング活動やツールにいかす場合には非常に便利です。O2Oシステムの構築、MailChimp/Exact Target/ExperianなどのEメールマーケティングソフトウェアにフィードバックを行ったり、CRM、DMPなどとの連係も可能です。
# 参考情報
以下、付随情報のリンクです。
- [Treasure Data JavaScript SDK 公式ドキュメント](http://docs.treasuredata.com/articles/javascript-sdk)
- [Treasure Data JavaScript SDK Githubリポジトリ](https://github.com/treasure-data/td-js-sdk)
IDCFクラウド上で提供している[Yahoo!ビッグデータインサイト](http://www.idcf.jp/lp/bigdata/)でもエンドポイントを変えるだけで同じ手順が使用出来ます。初期化時のhost名のみ異なります。
- [Yahoo!ビッグデータインサイト JavaScript SDK 公式ドキュメント](http://ybi-docs.idcfcloud.com/articles/javascript-sdk)
DMPとの連係事例もあります。
- [Intimate Merger のDMPとTreasure Dataを使った簡易プライベートDMP(改訂版)](http://nebula.intimate-merger.info/entry/2014/09/26/152743#.VDzb1dS-gtE)
また、Treasure DataではiOS / Android / Unity向けのSDKも提供しています。その話はまた他で。
- http://docs.treasuredata.com/categories/mobile-sdks
- [TreasureData + iOS SDK](http://qiita.com/akito1986/items/6794b75c3b3825cf2c7e)