OGP協議的使用

OGP協議是一套Metatags的規格,用來標註頁面,告訴我們你的網頁快照。幫助社交app高效並準確的獲取網頁中的核心鏈接、標題、主圖、正文摘要等信息,使得該網頁在社交分享中有更好的展現體驗。
如果網頁不支持OGP,那麼基於算法和規則來提取網頁中標題、主圖、正文摘要,準確性無法做到100%,體驗也不能充分保證。尤其是有部分頁面html採用前端js渲染,而不是服務端渲染,會導致無法提取主圖、正文摘要,鏈接卡片體驗感不好。

如何適配Open Graph Data

只需要在頁面的HTML標籤中增加以下meta標籤即可

<head>
<!-- Open Graph data -->
<meta property="og:title" content="Title Here" />
<meta property="og:url" content="http://www.example.com/" />
<meta property="og:image" content="http://example.com/image.jpg" />
<meta property="og:description" content="Description Here" />
</head>

重要:出於性能和體驗考慮,鏈接轉卡片服務不支持執行HTML中的js,上述Metatags必須在服務端渲染。

OGP在釘要消息上的應用如apple官網

釘釘相關OGP的介紹

https://open.dingtalk.com/document/orgapp/message-card

OGP參考:

https://moz.com/blog/meta-data-templates-123?spm=ding_open_doc.document.0.0.7f0725b2ttBqfP

http://ogp.me/?spm=ding_open_doc.document.0.0.7f0725b2ttBqfP

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章