自己紹介
- 夏目祐樹
- 株式会社クリック
- 新卒二年目の新人
- @sinofseven
- AWS歴: 1年弱
物語が大好きです
Kindleには欲しいものリストがない
どうやって気になる本を記録しよう
ブックマーク
- スマホだといろいろ面倒
- スマホとPCでデフォルトの保存位置が異なる
- PCならともかく、スマホだと入力が大変
- あとで整理しようと思った時に各ブラウザのブックマークマネジャーの上でしか整理できないから面倒
じゃあ、REST APIとブックマークレットでデータを集積できるシステムを作ろう
なぜ、そんな考えになったか
派遣先のProxyでQiitaが見れなかったため、API GatewayとブックマークレットでQiitaの記事をダウンロードする仕組みを昔作っていたから
構成
- S3にデータ保存用のJSONファイルを置く
- ブックマークレットから叩くAPI GatewayとLambdaを定義
- 保存したデータを見るためのHTMLはAPI GatewayのResponseテンプレート(?)に記述
- 別にS3に置いても問題はない
- HTMLファイルを置くのが面倒なのと、テンプレートに書くとWeb COnsoleだけで書ける
- 独自ドメインを使いたければCloud Frontを置いてしまえばいい
定義したAPI
- regist
- POST
- ブックマークレットが叩くAPI
- show
- GET
- Responseテンプレートの機能でJSONデータを入れたHTMLを返していた
- データ数が多くなったら途中までしか表示されなくなった
- get
- GET
- showですべてのデータが見れなくなったからJSONファイルをそのまま返すAPI
- APIで返した理由はS3のWebホスティングやCloud Frontの設定をするのが面倒だったから
おまけ 〜API GatewayだけでWebページを返す方法〜
- メソッドレスポンスの「HTTPのステータス」が"200"のものの、レスポンスモデルのコンテントタイプを"text/html"に変更する
- 統合レスポンスの「メソッドレスポンスのステータス」が"200"のものの、本文マッピングテンプレートに"text/html"を追加し、テンプレートにHTMLを記述する。
(VTLというテンプレートエンジンでLambdaの戻り値を使用することもできる)
おまけ 〜Kindleにもほしい物リストできてました〜
おまけ 〜ブックマークレットでjQueryを使う〜
ブックマークレットで jQuery を使う魔法の 210 文字
最後に
- ブックマークレットとAPIでデータを登録するとPC, スマホ問わず簡単にデータの登録ができて便利
- 非常に手軽