ある程度の規模の会社であれば、Googleサイトを利用して社内のポータルサイトを作成し、会社から社員への情報提供や、社員同士の情報共有のツールとして活用されていることも多いのではないでしょうか。

もしもあなたがこのような社内ポータルサイトを運営、管理する担当者であれば、サイトがどれだけ多くの社員に閲覧されているのか、さらには具体的に「誰に」閲覧されているのかの情報が欲しいと感じられることがあるのではないでしょうか。

今回は、Googleサイトのアクセスログをバイネームで取得し、スプレッドシートに書き出す方法について紹介していきます。記事執筆の都合上、旧Googleサイトを題材としていますが、新しいGoogleサイトでも同様の方法で行うことができます。

アウトプットイメージ

https://docs.google.com/spreadsheets/d/1jqmOu54YKLRmN3P_lRHh5nl41sNXRerIo0KnyNbbH3E/edit#gid=0

今回は、上記スプレッドシートのように、

「アクセスタイムスタンプ」「アクセス者のメールアドレス」「アクセス者のブラウザ情報」「アクセス者の利用OS情報」「アクセス者のブラウザのサイズ」の情報を取得して１行ずつ記録していきます。

上記スプレッドシートは編集権を限定しておりますので、利用になる場合はコピーしてお使いください。

利用方法

1.ログを残すスプレッドシートの用意

まず、Googleサイトのアクセスログを記録するたのスプレッドシートを用意します。先ほど紹介したこちらのスプレッドシートをご自身のドライブにコピーいただくと便利でしょう。

2.Webアプリケーションの作成

次に、Googleサイトのアクセスログを取得するための「仕掛け」であるWebアプリケーションを作成します。まずは意味がわからなくても構いませんので、以下の手順に沿って実行してみてください。

用意いただいたスプレッドシートの上メニューから、

「ツール」→「スクリプトエディタ」

を選択し、スクリプトエディタを起動してください。

先ほど紹介したスプレッドシートをコピーされていれば、スクリプトエディタには既になんらかのコードが記述されているはずです。

コード冒頭には、

var shid=”1jqmOu54YKLRmN3P_lRHh5nl41sNXRerIo0KnyNbbH3E”;

と記述してありますが、このダブルクォーテーションの間の文字列を、コピーしてできた新しいスプレッドシートのスプレッドシートIDに書き換えてください。

スプレッドシートIDとは、スプレッドシートを開いているブラウザのアドレスバーに記載されているURLの「https://docs.google.com/spreadsheets/d/」から、「/edit」までの間に含まれている文字列を表します。

3.Webアプリケーションの公開

スプレッドシートIDの書き換えが出来れば、コードの改修は完了です。

スクリプトエディタの

「公開」→「ウェブアプリケーションとして導入」

を選択してください。

以下画像のようなメニューが表示されるので、「導入」をクリックしてください。（※利用環境やバージョンにより表示は異なる可能性があります。）

4.Webアプリケーションの表示

「導入」をクリックすると、以下画像のように表示されますので、「現在のウェブ アプリケーションの URL:」として記載されているURLをコピーし、ブラウザの新しいタブで開いてみてください。

真っ白なページが表示され、スプレッドシートにログが記録されていれば成功です。

5.Googleサイトへの設置

いよいよ最後のステップである、Googleサイトへの設置を行います。

以下画像の通り、アクセスログを集計したいサイトのページの編集画面を開き、

「挿入」→「Apps Script」

を選択してください。

次に、以下画像のように表示されますので、

「または、サービスとして既に公開されている Apps Script の URL を貼り付け:」のところに、先ほど作成したWebアプリケーションのURLを貼り付け、「選択」をクリックしてください。

以上で、アクセスログ収集の準備は完了です。

スクリプトを設置したサイトのページを開くと、スプレッドシートにログが記録されているはずです。

解説

以下、今回紹介した方法がなぜ動作するのかについて詳細を解説します。

コード.gs

function doGet() {

var t=HtmlService.createTemplateFromFile(“index”);

return t.evaluate();

}

作成したWebアプリケーションをブラウザで開くと、まずはじめにdoGet()が実行されます。

「index」という名前のhtmlファイルを呼び出し、生成しています。

function setlog(browser,os,height,width){

var time=new Date();

var user=Session.getActiveUser();

var sh=SpreadsheetApp.openById(shid).getSheetByName(“ログ”);

sh.appendRow([time,user,browser,os,height,width]);

}

index.html側からブラウザやOSなど、ログに残したい情報をsetlog関数が受け取り、スプレッドシートに記入しています。

Session.getActiveUser()は、スクリプトの実行者の情報を取得できますので、今回のようにサイトのアクセスログを取得する場合に限らず、ユーザーごとに権限を分けた社内ツールの開発などでも有用ですので、使いこなせるようになると便利でしょう。

sh.appendRowは、シートの最終行に配列形式で渡したデータを貼り付けてくれます。常に最終行を操作してくれるので、こちらから何行目かを指定してあげる必要がないため、これも覚えてくれると役立つでしょう。

index.html

次に、フロント側のコードを確認していきます。

function getlog(){

var userAgent = window.navigator.userAgent.toLowerCase();

var browser;

if(userAgent.indexOf(‘msie’) != -1 ||　userAgent.indexOf(‘trident’) != -1) {
browser=’Internet Explorer’;
} else if(userAgent.indexOf(‘edge’) != -1) {
browser=’Edge’;
} else if(userAgent.indexOf(‘chrome’) != -1) {
browser=’Google Chrome’;
} else if(userAgent.indexOf(‘safari’) != -1) {
browser=’Safari’;
} else if(userAgent.indexOf(‘firefox’) != -1) {
browser=’FireFox’;
} else if(userAgent.indexOf(‘opera’) != -1) {
browser=’Opera’;
} else {
browser=’不明’;
}

var os= navigator.platform;
var height= screen.height;
var width= screen.width;

google.script.run.setlog(browser,os,height,width);

}

window.navigator.userAgentでは、ユーザーのブラウザ情報を取得できますが、ブラウザの名前そのものが得られるわけではありませんので、含まれるキーワードに応じて場合分けしてブラウザの名前を特定させています。

必要な情報を変数に格納した後、

google.script.run.setlog(browser,os,height,width);

にて、コード.gs側のsetlog関数を呼び出し、変数を受け渡して実行させています。

今回の場合では、フロント側の関数から直接スプレッドシートに書き込みができれば良さそうですが、html上に書かれた関数ではSpreadsheetAppが動きませんので、フロント側では情報の取得のみを行い、スプレッドシートへの書き込みはGASで行うという役割分担となっています。このように、フロント側からGASを実行させる際には必ずgoogle.script.runを用いることになります。

まとめ

以上が、GASを使ってGoogleサイトのアクセスログをバイネームで取得する方法になります。

誰がどれくらいアクセスしているのかを確認できれば、どれくらいの人に興味を持ってもらえているのか、どのような情報が求められているのかなども把握できますので、より良いサイト運営につなげることができるでしょう。