Find N3入網(wǎng)：最高支持16+1TB
OPPO將于近期登場(chǎng)的Find N3折疊屏目前已經(jīng)正式入網(wǎng)，型號(hào)為PHN110。本次Find N3在外觀方面相比前兩代有很大的變化，不再是小號(hào)的橫向折疊屏，而是跟別的廠(chǎng)商一樣采用了較為常見(jiàn)的
為了提高用戶(hù)對(duì)頁(yè)面鏈接分享的體驗(yàn)，需要對(duì)分享鏈接做一些處理。
以 Telegram(國(guó)外某一通訊軟件) 為例，當(dāng)在 Telegram 上分享已做過(guò)處理的鏈接時(shí)，它會(huì)自動(dòng)嘗試獲取鏈接的預(yù)覽信息，包括標(biāo)題、描述和圖片。
如此當(dāng)接收者看到時(shí)，可以立即獲取到分享鏈接的一些重要信息。這有助于接收者更好地了解鏈接的內(nèi)容，決定是否點(diǎn)擊查看詳細(xì)內(nèi)容。
對(duì)于URL分享預(yù)覽這個(gè)功能問(wèn)題，在項(xiàng)目中挺常用的，只不過(guò)今天我們是以一些框架分享API的底層原理角度來(lái)講的。
實(shí)現(xiàn)這種功能的關(guān)鍵，是在分享的鏈接中嵌入適當(dāng)?shù)脑獢?shù)據(jù)信息，應(yīng)用軟件會(huì)自動(dòng)解析，請(qǐng)求分享鏈接的預(yù)覽信息，并根據(jù)返回的元數(shù)據(jù)生成預(yù)覽卡片。
對(duì)于國(guó)內(nèi)的應(yīng)用軟件，目前我試過(guò)抖音，它可以實(shí)現(xiàn)分享和復(fù)制粘貼都自動(dòng)解析，而微信、QQ等只能實(shí)現(xiàn)分享的自動(dòng)解析。
對(duì)于國(guó)外的應(yīng)用軟件，我只實(shí)驗(yàn)過(guò)Telegram，它可以實(shí)現(xiàn)分享和復(fù)制粘貼都自動(dòng)解析，但我想Facebook、Twitter、Instagram這些應(yīng)用應(yīng)該也都是可以的。
實(shí)現(xiàn)URL鏈接的分享預(yù)覽，你可以使用Open Graph協(xié)議或Twitter Cards，然后在 HTML 的<head>標(biāo)簽中，添加以下meta標(biāo)簽來(lái)定義鏈接預(yù)覽的信息。
使用時(shí)，將所有meta全部復(fù)制過(guò)去，然后根據(jù)需求進(jìn)行自定義即可。
還要注意兩點(diǎn)，確保你頁(yè)面的服務(wù)器正確配置了 SSL 證書(shū)，以及確保鏈接的URL有效（即：服務(wù)器沒(méi)有做白名單限制）。
<head><!-- Open Graph 協(xié)議 --><meta property="og:title" content="預(yù)覽標(biāo)題"><meta property="og:description" content="預(yù)覽描述"><meta property="og:image:width" content="圖片寬度"><meta property="og:image:height" content="圖片高度"><meta property="og:image" content="預(yù)覽圖片的URL"><meta property="og:url" content="鏈接的URL"><!-- Twitter Cards --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="預(yù)覽標(biāo)題"><meta name="twitter:description" content="預(yù)覽描述"><meta property="twitter:image:width" content="圖片寬度"><meta property="twitter:image:height" content="圖片高度"><meta name="twitter:image" content="預(yù)覽圖片的URL"><meta name="twitter:url" content="鏈接的URL"></head>下面我們做一些概念的整理、總結(jié)和學(xué)習(xí)。
Open Graph協(xié)議是一種用于在社交媒體平臺(tái)上定義和傳遞網(wǎng)頁(yè)元數(shù)據(jù)的協(xié)議。它由 Facebook 提出，并得到了其他社交媒體平臺(tái)的支持和采納。Open Graph 協(xié)議旨在標(biāo)準(zhǔn)化網(wǎng)頁(yè)上的元數(shù)據(jù)，使網(wǎng)頁(yè)在社交媒體上的分享和預(yù)覽更加一致和可控。
通過(guò)在網(wǎng)頁(yè)的 HTML <head> 標(biāo)簽中添加特定的 meta 標(biāo)簽，使用 Open Graph 協(xié)議可以定義和傳遞與網(wǎng)頁(yè)相關(guān)的元數(shù)據(jù)信息，如標(biāo)題、描述、圖片等。這些元數(shù)據(jù)信息可以被社交媒體平臺(tái)解析和使用，用于生成鏈接預(yù)覽、分享內(nèi)容和提供更豐富的社交圖譜。
使用 Open Graph 協(xié)議，網(wǎng)頁(yè)的所有者可以控制鏈接在社交媒體上的預(yù)覽內(nèi)容，確保鏈接在分享時(shí)顯示的標(biāo)題、描述和圖片等信息準(zhǔn)確、有吸引力，并能夠準(zhǔn)確傳達(dá)鏈接的主題和內(nèi)容。這有助于提高鏈接的點(diǎn)擊率、轉(zhuǎn)化率和用戶(hù)體驗(yàn)。
Open Graph 協(xié)議定義了一組標(biāo)準(zhǔn)的 meta 標(biāo)簽屬性，如 og:title、og:description、og:image 等，用于提供鏈接預(yù)覽所需的元數(shù)據(jù)信息。通過(guò)在網(wǎng)頁(yè)中添加這些 meta 標(biāo)簽并設(shè)置相應(yīng)的屬性值，可以實(shí)現(xiàn)鏈接預(yù)覽在社交媒體平臺(tái)上的一致展示。
需要注意的是，Open Graph 協(xié)議是一種開(kāi)放的標(biāo)準(zhǔn)，并不限于 Facebook 平臺(tái)。其他社交媒體平臺(tái)，如 Twitter、LinkedIn 等，也支持使用 Open Graph 協(xié)議定義和傳遞網(wǎng)頁(yè)元數(shù)據(jù)，以實(shí)現(xiàn)鏈接預(yù)覽的一致性。
Twitter Cards 是一種由 Twitter 推出的功能，它允許網(wǎng)站所有者在他們的網(wǎng)頁(yè)上定義和傳遞特定的元數(shù)據(jù)，以便在 Twitter 上分享鏈接時(shí)生成更豐富和吸引人的預(yù)覽卡片。通過(guò)使用 Twitter Cards，網(wǎng)頁(yè)鏈接在 Twitter 上的分享可以展示標(biāo)題、描述、圖片、鏈接和其他相關(guān)信息，以提供更具吸引力和信息豐富的鏈接預(yù)覽。
Twitter Cards 提供了多種類(lèi)型的卡片，以適應(yīng)不同類(lèi)型的內(nèi)容和需求。以下是 Twitter Cards 的一些常見(jiàn)類(lèi)型：
通過(guò)在網(wǎng)頁(yè)的 HTML <head> 標(biāo)簽中添加特定的 meta 標(biāo)簽，使用 Twitter Cards 可以定義和傳遞與鏈接預(yù)覽相關(guān)的元數(shù)據(jù)信息，如標(biāo)題、描述、圖片、鏈接等。這些元數(shù)據(jù)信息將被 Twitter 解析和使用，用于生成鏈接預(yù)覽卡片。
使用 Twitter Cards 可以使鏈接在 Twitter 上的分享更加吸引人和信息豐富，提高鏈接的點(diǎn)擊率和用戶(hù)參與度。它為網(wǎng)站所有者提供了更多控制鏈接在 Twitter 上展示的能力，并提供了一種更好的方式來(lái)呈現(xiàn)他們的內(nèi)容。
本文鏈接：http://www.tebozhan.com/showinfo-26-78300-0.htmlHTML問(wèn)題：如何實(shí)現(xiàn)分享URL預(yù)覽？
聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。郵件：2376512515@qq.com
上一篇： 還在重復(fù)創(chuàng)建對(duì)象？快試試通過(guò)享元模式減少對(duì)象創(chuàng)建
Copyright ? 2016-2023 天津谷騏科技有限公司 版權(quán)所有 sitemap.xml
違法及侵權(quán)請(qǐng)聯(lián)系：2376512515@qq.com 津ICP備18001702號(hào)
津公網(wǎng)安備 12010102000574號(hào)