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

microCMS の プレビューモードの実装

microCMS の プレビューモードの実装

8/5 でプレビューモードの判定の話してたけど、まだ続きがあった。

そもそも Next.js の context.preview という boolean | undefined なプロパティがあるのに draftKey を使ってプレビューモードを判定していた。

これには理由があって、↑の記事で書いたとおり draftKey が空でもプレビュー用の API が叩けてしまうので、公開中の記事もプレビューモードで開けてしまうからだった。

だったんだけど、ちょっと見直して draftKey がないときは res.setPreviewData() を呼ばないようにすればいいということに気づきそうした。

ただ、結局 Cookie は保存されるので、例えば下書き状態のコンテンツをプレビューモードで表示したあとにブラウザを閉じずに公開中のコンテンツを「プレビュー画面で表示する」から表示すると、公開中の記事でもプレビューモードとして開いてしまう。

もちろんプレビューモードとして開いてしまうだけなので、その挙動をよしとするならそれでいいと思うんだけど、公開中の記事をプレビューモードで開けてしまうのには違和感があった。

なので、結局 res.clearPreviewData() を呼ばなければいけないんだけど、これを呼ぶタイミングは プレビュー用の API の handler の最初で呼ぶことにした。

結局毎度 previewData をクリアしないと、公開中のコンテンツをプレビューモードで開こうとした段階でこの API を呼び出してしまい Cookie が生きててプレビューモードとして認識されてしまう。

Cookie の寿命をめちゃくちゃ短くするかこの処理にするか悩んだけど、プレビューモードで開こうとするたびに previewData を新しく格納するほうが自然かなと思ったのでこうした。あってるのか分からない。