やりたいこと

noteみたいにURLを貼ったらogpを読み取ってリッチに表示するようにする

検討している実装手段

ビルドのタイミングでbodyを直接書き換える方法を取る。

具体的に

URLを検出したら以下のライブラリを利用してogp情報を取得する
https://www.npmjs.com/package/ogp-parser

Nuxt.jsでのプライグインの利用方法も忘れない
https://qiita.com/fj_yohei/items/cddf267a94fa30ecb0b8

課題

microCMSではaタグが使えるのだけど、aタグで貼ったときはむりやりリッチリンク化したくないので、そこは無視するようにする。

具体的に

これはリッチリンク化したいURL
https://blog.utautattaro.com/post/syhfsmmuk/'>https://blog.utautattaro.com/post/syhfsmmuk/


これはしたくないURL
https://blog.utautattaro.com/post/syhfsmmuk/

とりあえずやってみよう