lambdynamo-counter

lambdynamo-counter とは？　AWSのLambda関数とDynamoDBで構成されたアクセスカウンタです。

github.com

ここしばらく息抜きに20世紀風のホームページを作っている。

https://7474.github.io/homepage/

ホームページにはアクセスカウンタが必須なのだけれど、20世紀風のアクセスカウンタサービスを探すより作った方が早かろうと作った形。

以前こういう遊びをしていたこともあるので、そのリメイクでもある。

inside.dmm.com

追記： AWS LambdaとServerlessのカレンダー | Advent Calendar 2022 - Qiita のシリーズ2が空いていたので参加しておいた。9日目です。

アクセスカウンター

HTTPでGETアクセスするたびにカウントアップする数値の画像を返却するWebアプリケーション。

HTMLのimg要素のsrcに指定することで、そのページへのアクセス数を表示できる。

数字の画像を指定出来たり、同一IPアドレスからのアクセスではカウントアップしないなどのオプション機能があったりする。

lambdynamo-counter の要素技術

そのアクセスカウンターをどう実装したか。

• Lambda 関数 URL の呼び出し - AWS Lambda
  • Lambda関数URLでGETリクエストを処理、SVGを返却する
  • なんとCORSも設定できるので特定のホームページにのみ設置を許可のようなこともできる
• Amazon DynamoDB とは - Amazon DynamoDB
  • AWSでは珍しく、一定規模まで永続的に無料で使えるキーバリュー形式のDB
  • あるキーの値を加算する更新や、更新するしないの条件指定ができる
  • これを利用してアクセス毎にカウンタ値を加算、前回のIPアドレスを記録しておいて同一のIPアドレスなら更新しない、などの処理を行っている
• Scalable Vector Graphics - Wikipedia
  • XML形式の画像
  • テキストデータとして画像を配信出来て便利
• Terraform | HashiCorp Cloud Platform
  • 簡単にGitHubと接続してCDを構成できて便利

以前試した時と比べて、Lambda関数単体でHTTPリクエストを受け付けられるようになった点が大きく違う。

永続化する先のDynamoDBとHTTPリクエストを処理するLambda関数のみで基本的なWebアプリケーションが完成してしまう。これはすごいことだと思う。しかも一定量の規模までは無料だ。

より簡単にするために、アクセスカウンタの値はSVGとして返却した。

DynamoDBにアクセス出来て、SVG（テキストデータ）を編集できれば良いだけなので、ランタイムは何でもよかった。とりあえず1ファイルで動くものを作れるNode.jsにしておいた。

アクセスカウンタはHTTPのゲットリクエストを受けて、リソースを変更、変更した結果を返却する、というなかなか考えどころのある要素が詰まっていて、小さいWebアプリケーションを考えるにはいい題材だと思う。

他の構成で試してみても良さそうだ。

展望

Issueを起票している。

https://github.com/7474/lambdynamo-counter/issues

現状見た目が20世紀風になっていないので、それを達成することを第一に考えたい。

それをした後は、飽きて放置かな。その位の息抜きリポジトリでした。