Posted at

トラッキング/ウィジェットタグの作成方法(like GoogleAnalytics, Facebook)

More than 3 years have passed since last update.

アクセス解析やウィジェットの表示に際して、

埋め込みをさせられるscriptタグについてのロジックがあまり出回っていないので、

作って解説してみました。

以下、サンプルとして載せているコードはほぼGAやFBのコピーです。


hoge/index.html

<html>

<head>
<title>TestPage</title>
</head>
<body>
<script>
(function(d, s){
var js, fjs = d.getElementsByTagName(s)[0];
js = d.createElement(s);
js.src = "./app.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script'));
</script>
</body>
</html>


hoge/app.js

// お好きな処理をJSでどうぞ

こういったものを用意し、

ウェブページオーナーに script タグを貼り付けてもらうだけで、

そのページにアクセスしたユーザーに app.js の中にあるJSスクリプトを実行させることができます。

js.src = "./app.js"; の部分には、

任意の呼び出したいスクリプトを指定することができます。

外部サーバーにあるファイルの場合は、

https://www.google-analytics.com/analytics.js のように指定することも可能です。

※ 上記URLはGAのもの

呼び出し先のスクリプトなどには uglify などを使って難読化をしておくとよいかもしれません。