技術とかの雑なToday I Learnedメモ

プレビューモードの setPreviewData() を呼ぶかどうかを draftKey の有無で分岐する

プレビューモードの setPreviewData() を呼ぶかどうかを draftKey の有無で分岐する

microCMS のプレビューモードにおいて、プレビューかどうかを判定するために Next.js の context.preview を使って判定している。

Advanced Features: プレビューモード | Next.js

microCMS のプレビューモードは、下書き中のコンテンツではなくても(公開中のコンテンツでも)プレビューモードとしてリンクを開くことができる(プレビューモードのリンクがある)

ただしその場合 draftKey は設定されない。

draftKey が設定されなくても API Routes でプレビュー用のハンドラーが呼び出され、そこで普通に res.setPreviewData() すると Cookie の有効期限が無期限になるので、公開中の記事がプレビューモードで表示される。

なので draftKey が空の場合は setPreviewData を避けて redirect する必要があるのだが、それを忘れると公開中の記事が下書き状態で開けてしまい、かつそのブラウザを閉じないと普通に(microCMS の管理ページではなく実際のアプリケーションのページから)アクセスしても Cookie が残っているので下書きページとして表示される。

Cookie の有効期限の設定もしくはいいタイミングで clearPreviewData を呼び出す必要がある上に draftKey の有無による setPreviewData の呼び出し分岐も必要なのでちょっと迷った。

ちなみに clearPreviewData をうまいこと利用しようと思ってうまくいかなかったんですがなんかうまい方法ないですかね。