自分でOGPクライアント作ってみた。動くかテスト。 動かないので消しました
コードはこんな感じ。もう少し改良する。
export const OGP = ({ url }) => {
const [og, setOg] = useState(null)
useEffect(() => {
if (!og) {
Axios.get(url, { responseType: 'document' }).then((res) => {
let [image, title] = ['', '']
res.data.head.childNodes.forEach((child) => {
if (child.nodeName === 'META') {
if (child.getAttribute('property') === 'og:image') {
image = child.getAttribute('content')
}
if (child.getAttribute('property') === 'og:title') {
title = child.getAttribute('content')
}
}
})
setOg({ image, title })
})
}
}, [og])
return (
<Lazy>{og ? <> <p>{og.title}</p> <img src={og.image} width={'50%'} /> </> : 'loading'}</Lazy>
);
}