トップ/記事一覧

Notion API でブログを構築するときの画像の Expire Date 問題を解決したい → 解決した

📆2021/10/08(最終更新日:2021/11/02)🔖 Notion APINotion Blog

Notion API でブログを構築する

このブログは Notion の公式 API で取得したデータを使って構築されている。最近ページ取得の API で画像もサポートされたっぽく、いよいよヘッドレス CMS として Notion のデータベースを使えるようになってきたような気がする。

とは言え課題はちょこちょこあって、データベースの取得件数の上限が 100 件だったり、ページ内の取得できるブロックの上限が決まっていたりと、さまざまな制約をうまく実装でカバーしなければならないという現状。

画像について

Notion にアップロードした画像は裏側では S3 にアップロードされる仕組みになってるっぽく、この画像を Notion API で取得すると Expire Date が付いた状態で返却されてしまう。この画像 URL の有効期限は 60 分間で、当たり前なのだが、Expire Date を超えた画像に関しては 403 でエラーが返ってきてしまう。(ユーザーから見るとたまに画像がリンク切れで表示されてしまう(2021/10/08 時点))

リンク切れになってしまった画像 URL へリクエストを飛ばす
リンク切れになってしまった画像 URL へリクエストを飛ばす

僕のブログは Next.js を使用していて、revalidate の機構が入っているので、一度アクセスして画像リンク切れのような表示になっていても、次回アクセス時には再度 Notion API から fetch し直してくれるので、Expire Date が更新された状態で再取得してくれる。この機構のおかげで次回アクセス時には画像が出るのだけれども、とは言え一度でも画像が取得できないみたいになるのはユーザー体験が悪いのでなんとかしたい。

Vercel で毎日 cron 的にビルドデプロイ走らせる機構があればそれを使うか、なかったら自分で GitHub Actions で Vercel の webhook 叩くか、もしくは GitHub Actions の cron でタグ付けてそれをデプロイのトリガーにするか、色々手段はありそう。ちょっと調べてみる。

🐈

2021/10/09 追記

実装してひとまず解決

とりあえず GitHub Actions で定期的にデプロイしなおす仕組みを実装して解決した。とりあえず1時間に1回、自動でデプロイしなおす仕組みにしてみた。Vercel 側の Limit と Notion API 側の Limit があるが、この程度なら全然問題なさそう。でも、1回のビルドに10分程度かかるので、今度はGitHub Actions の無料枠の利用上限には引っかかりそうな気がする。ビルド時間を短縮したりする工夫は必要そう。もしくは、プライベートリポジトリをやめてパブリックリポジトリにするなどでも良いかもしれない(そうすると無料になるらしい) → パブリックに変更した。

GitHub Actions 側の cron 実行ログ
GitHub Actions 側の cron 実行ログ

Vercel 側のデプロイログ
Vercel 側のデプロイログ

2021/11/02 追記

以下のようなリプライを頂きました。

記事によると、以下のような実装方針で実現されてる方もいるようです(こっちの方が良さげ)

Notionが1時間で切れるS3のアドレスを渡してくれるのを、自分が管理してるAWS S3のバケットに置き、そこのURLを参照する方針を実装しました。

🐈

Notion API 側が対応してくれるのが一番良いんですけどね。

🐈