ページを選択

ストブロ

Coffee's Blog.

アプリへのアクセスを解析して利用状況を把握したい!

執筆者 | 2022年11月01日 | Coffee, Kintone, ストブロ

アプリを作ったけど、「果たして本当に使ってもらっているの?」という不安がつきまとう(笑) 逆に言えばアクセスが少ないアプリは、何か改善が必要なのかも…そのアプリの利用状況をログとして保存し、アクセス解析に使用したい!と思いました。そしたら、全然そういうのはないんですね…

何人かの方がコードを公開してくださっていましたが、今回はKentaro1sh11さんのコードを参考に、何とか改造してみました!私プログラムは書けないので、あちこちのコードを切り貼りして…

改造の初期、どうしても訳が分からずKentaro1sh11さんに教えを請いました。「詳しくは分かりませんが」と前置きの上で、ヒントを頂いてその後 twitterで涼雨 零音さんからもアドバイスを頂き、なんとか形になりました。

お二人とも有り難うございました!

 Qiita 1sh11 Kentaroさんのページはこちら←

 twitterアカウント:kentaro1sh11

そして涼雨 零音:Rainy’s ASMR からも教えて頂きました!

 https://rainsuzusame.net/
 twitterアカウント:@RSuzusame

出来上がったアクセスログの記録アプリはこんな感じです。
Kentaro1sh11さんのコードから改良した部分は以下の2点です。

  1. デバイスの表記の追加
  2. カウンター表示の追加

デバイスの評価は物凄くアナログに解決しています(笑)そもそもデスクトップ用とスマホ用のJavaScriptが違うモノなので、文字列で記入するようにしました。

カウンターは以下の条件で動作します。

  • 閲覧者が同一の最新のレコードの情報を取得
  • アプリIDが異なればアクセスログアプリに新しいレコードを追加
  • アプリIDが同一ならカウンターに1を加算

こんな感じです。

実際に出来上がったコードはこの通り(継ぎ接ぎだらけで酷いコードだと思います。誰か直して欲しい…)
パソコン用js

(() => {
	'use strict';

const postAccessLog = async () => {


		//アプリ名の取得
		const paramGet = {
			'id':kintone.app.getId()
		};
		const respGet = await kintone.api(kintone.api.url('/k/v1/app.json', true), 'GET', paramGet);

		//ログインユーザー名取得
		const loginUserName = kintone.getLoginUser()['name'];


		// アクセスログアプリのアプリID
		const app = 221;


		// アクセスログアプリへのレコード登録
		const paramPost = {
			'app': app,
				'record': {
					'appId': {
						'value': kintone.app.getId()
					},
					'accessUrl': {
						'value': location.href
					},
					'device': {
						'value': 'PC'
					},
					'appName': {
						'value': respGet.name
					},
					'counter': {
						'value': 1
					}
,

				}
		};



		//AccessLogアプリから閲覧者が一致する最新レコードを取得
		const getAppInfo = {
			'app': app,
			'query': '閲覧者 in ("' +  kintone.getLoginUser()['code'] + '") limit 1',
			'fields': ['$id','appId','counter','閲覧者'],
		};


		const respAppId = await kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', getAppInfo);


		const lastAppId = respAppId.records[0].appId.value;


		const nowAppId  = kintone.app.getId();

		if (nowAppId == lastAppId) {

			if (respAppId.records[0].counter.value == "") {

				var counterup = 1;
				console.log(counterup);

			}else{

				var counterup = Number(respAppId.records[0].counter.value) + 1;
				console.log(counterup);

			}



		// アクセスログアプリへのレコード更新
		const paramPut = {
			'app': app,
			'id': respAppId.records[0].$id.value,
			'record': {
					'counter': {
						'value': counterup
					}
				},
		};



			const respPut = await kintone.api(kintone.api.url('/k/v1/record', true), 'PUT', paramPut);

		}else{

			const respPost = await kintone.api(kintone.api.url('/k/v1/record', true), 'POST', paramPost);

		}//if
	}//postAccessLog


//  ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼
//    一覧画面表示時
//  ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲
	kintone.events.on('app.record.index.show', (event) => {
		postAccessLog();
	});

//  ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼
//    詳細画面表示時
//  ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲
	kintone.events.on('app.record.detail.show', (event) => {
		postAccessLog();
	});

//最終行
})();

モバイル用JS


(() => {
	'use strict';


const postAccessLog = async () => {


		//アプリ名の取得
		const paramGet = {
			'id':kintone.mobile.app.getId()
		};
		const respGet = await kintone.api(kintone.api.url('/k/v1/app.json', true), 'GET', paramGet);

		//ログインユーザー名取得
		const loginUserName = kintone.getLoginUser()['name'];

		// アクセスログアプリのアプリID
		const app = 221;


		// アクセスログアプリへのレコード登録
		const paramPost = {
			'app': app,
				'record': {
					'appId': {
						'value': kintone.mobile.app.getId()
					},
					'accessUrl': {
						'value': location.href
					},
					'device': {
						'value': 'スマホ'
					},
					'appName': {
						'value': respGet.name
					},
					'counter': {
						'value': 1
					},

				}
		};



		//AccessLogアプリから閲覧者が一致する最新レコードを取得
		const getAppInfo = {
			'app': app,
			'query': '閲覧者 in ("' +  kintone.getLoginUser()['code'] + '") limit 1',
			'fields': ['$id','appId','counter','閲覧者'],
		};


		const respAppId = await kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', getAppInfo);


		const lastAppId = respAppId.records[0].appId.value;


		const nowAppId  = kintone.mobile.app.getId();

		if (nowAppId == lastAppId) {

			if (respAppId.records[0].counter.value == "") {

				var counterup = 1;
				console.log(counterup);

			}else{

				var counterup = Number(respAppId.records[0].counter.value) + 1;
				console.log(counterup);

			}


		// アクセスログアプリへのレコード更新
		const paramPut = {
			'app': app,
			'id': respAppId.records[0].$id.value,
			'record': {
					'counter': {
						'value': counterup
					},
				}
		};







			//更新処理はどう書くの?
			const respPut = await kintone.api(kintone.api.url('/k/v1/record', true), 'PUT', paramPut);

		}else{

			const respPost = await kintone.api(kintone.api.url('/k/v1/record', true), 'POST', paramPost);

		}//if


	}//postAccessLog


//  ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼
//    一覧画面表示時
//  ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲
	kintone.events.on('mobile.app.record.index.show', (event) => {
			postAccessLog();
	});


//  ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼ ▼
//    詳細画面表示時
//  ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲ ▲
	kintone.events.on('mobile.app.record.detail.show', (event) => {
		postAccessLog();
	});


//最終行
})();

このコードで以下の通り記録されます。

まだやれていないこと

やりたいけどまだ出来ていない事もいくつかあります。

  • URLをサブテーブルに記録(追加)していく。
  • 閲覧者の最新レコードが同一アプリIDだった場合でも、10分以上間隔が開いていれば新規レコードで記録する。

色々試して見ましたが、私にはまだ難し。
特にサブテーブルの扱いがちんぷんかんぷんです。

ご存じの方是非教えてください。
書き直してプラグイン化してくれたら最高です(笑)

Youtube LiveをPodcastに再配信する

これまただうさん向けの内容です。一定の需要があると思うので記事化しました。是非参考にしてみてください。 https://youtu.be/GcgdUdE0ewo Youtube Liveで「COHIRAJI」というラジオ配信をしています。...

COHIRAJIのOBS設定のご紹介

基本的にはだうさん個人にお知らせする為だけに記事を書いてます(笑)もったいないので同じような事をしたいと思っている方のお役に立てればと思って記事にする事にしました。 ここで紹介するのはOBSの設定です。...

fmlで自動応答を実現する その2

前回までは「Recieved」という固定したファイルの中身で自動応答する事が出来ました。文中に件名にも付与した「受付番号」を挿入したい…という事でまたしてもヤンマさんにヒントを貰いながら、トライ&エラー 無事に完成しました!...

fmlで自動応答を実現する

さくらのレンタルサーバーでメーリングリストを使用していますが、fmlというものが使用されています。 今回は「メールを送ってくれたら、送信者に受付番号を自動応答したい」という希望で色々調べたり、教えて貰ったりしました。...

Webalizerを再集計する

音声データを配信しているVPSのサーバーをやむなくSSL化した。すると、そこからWebalaizer(アクスセス解析機能)に正しくログが取れていない状態だった。気がついたのは約2ヶ月後(笑)普段あまり見ていないので。...

DIVI Builder で PageSpeed Insights を改善する

Googleの「PageSpeed Insights」はウェブサイトの表示速度を評価して、改善する為の検査ツールですが、評価内容が多岐にわたり中々スコアが上げられない感じになります。色々取り組みしているのを備忘録的に。...

さくらのVPSのSSL証明を自動更新

さくらのVPSでポッドキャストの配信を行っているが、これまではSSLを取得せずに放置してきた。そしたらGoogle先生が怒って、ウェブ上での再生が出来なくなりました(笑)と言うことでLet's Encyptを使用してSSL証明を取得しまし。...

「返信先」を指定していない場合の挙動

さくらのレンタルサーバーのメーリングリストでの挙動の問題と解決策です。前回に引き続きメーリングリストのシステム「fml」絡みの記事になります。...

0コメント


電器屋Walkerの過去配信のBGMで利用させて頂いております。

ポッドキャスト品質向上、整音テクニック 解説Live

開催のお知らせ

詳細はこちら

国際ポッドキャストの日

International Podcast Day Event

ツキイチ - 隣のポッドキャスト

まとめファンサイト