
对于从手机Safari 分享到微信的链接,有的可以在聊天界面展示卡片形式,经过探索发现,只需要支持开放图协议即可。
<html prefix="og: https://ogp.me/ns#"> <head> <title>The Rock (1996)</title> <meta property="og:title" content="The Rock" /> <meta property="og:type" content="video.movie" /> <meta property="og:url" content="https://www.imdb.com/title/tt0117500/" /> <meta property="og:image" content="https://ia.media-imdb.com/images/rock.jpg" /> ... </head> ... </html>
在react 中,想要动态修改meta 标签,可以使用react-helmet。当然,像飞书在发送链接的时候也是支持og协议的,但它应该是服务端抓取的接口,读不到js动态改的meta 内容,如果想支持好这种场景,就需要使用SSR。