はっすーずツール開発ブログ　#1

はっすーずツールをご利用いただきありがとうございます。

はっすーずツールがどのように開発されているのか、どのような技術が使用されているのかを開発ブログでお伝えしてまいります。

■ アクセス解析

□ 世界のGoogle

世界中の大半のウェブサイトはアクセス解析が行われています。それを実現するサービスを「アナリティクス」といいます。その中でもっとも有名なアナリティクスは「Google Analytics（GA4）」です。

GA4は主に、アクセスしたページ、アクセスした時間、閲覧時間、再閲覧の状況、操作イベント、おおよその位置情報（ブラウザや端末の設定によっては国・都道府県・市区町村と詳細な位置が送信されます）が一括で確認できます。

「えー、どこ住みかバレるじゃん」って思うかもしれませんが、全世界のサイトの半数以上が導入している技術なので、実質匿名はないということです。

位置情報はIPアドレスをもとに検索をするので若干ずれることがあります。

□ はっすーずツールでのアナリティクス

はっすーずツールでは3つのアナリティクスサービスと独自のシステム、そしてサーバー標準のアクセス解析の5つ体制でアクセス解析を行っています。

【Google Analytics】

主にどこからのアクセスか、どのページの利用が多いかを検査しています。

【Microsoft Clarity】

主に操作した際のエラーや、キャッシュ保持具合、リアルタイムアクセス状況の監視に使用されており、はっすーずツールでは主軸となるアナリティクスとなります。

【Cloudflare Browser Insights】

主にアクセス時の読み込み状況が正常か、配信に時間のかかるコンテンツはないかの検査が行われています。

【Hassus-User-Id-Maker】

主にユーザーIDの発行と、ブラウザとOSを取得する目的で実装しましたが、現在はコードのみが実装されているだけで、アクセス解析の一線からは退いています。

【スターレンタルサーバー　アクセス解析】

主に転送量やボット、エラー状況の検査に使われています。このアクセス解析をもとに、BingBotの異常なアクセスを検知しmicroCMSの転送量抑制を行いました。（25万アクセス/月が2ヶ月連続でありましたが、現在は対策済みです）

■ データ配信

はっすーずツールでは「microCMS」をデータ配信用のCMSとして使用しています。多くのサイトではWordpressというサービスが内部のデータベースと接続してデータ配信を行いますが、はっすーずツールはノンフレームワークかつ安全実装をするためmicroCMSからデータを取得し表示するようになっています。

はっすーずツールβでは、サーバー内にCSV/JSONファイルを置いて独自のCMSが開発されていましたが、不具合やセキュリティ上の観点からはっすーずツールVer:1.0のリリース時に廃止・microCMSへの切り替えが行われています。

また、サーバー内部の独自管理画面ではデータベースやFirebaseなども使用して開発が行われています。

■ 管理画面の技術

独自管理画面には、Google Analyticsのデータを取得して反映する独自の管理画面やHassus-User-Id-Makerの管理画面、各ページへのリンクやショートリンク管理画面、テスト中のサイトなどが実装されています。

■ 問い合わせフォーム

Ver:1.10アップデートで新システムに刷新されました。

これまではGoogleフォームに独自のデザインを重ねるデザインだったものの規約上の問題や長期運用のしづらさから、Google Apps Scriptというサービスを使用した独自のAPIを構築し直接Googleスプレッドシートに送信するものです。

不正処理・Bot処理防止の観点でGoogleフォームであればデフォルトでreCAPTCHAが実装されているため特に対策は不要ですが、新システムはそのシステムがなく、新たに認証システムを実装しなければなりません。reCAPTCHAも使用できないわけではないですが、上限値（とはいっても1万リクエスト/月。それ以降有料）があるので、またBotが異常アクセスをして認証が止まれば使用できなくなる恐れがあるのでCloudflare Turnstileが認証システムとして採用されました。

システム詳細はセキュリティ上の都合で省きますが、内部で複数のAPIが動いています。

■ アナリティクスや通信規格について

こちらから

今回ははっすーずツールで使用されている技術をまとめてみました。

次回は開発言語等について開発ブログといたします。

不定期公開
はっすーずツール開発ブログ　#1