实现分享出去的URL链接预览图片、标题和描述

开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 22 天，点击查看活动详情

分享一条url链接到其他app平台。例如飞书上、Twitter、Facebook等平台上。分享的链接会出现图片，标题，描述等内容。如下所示要是分享的链接展示的图片是一张引人注目的图片，比如黑丝，这不得吸引多少用户点击进来。相比一条冷冰冰的url，就像下面这样，谁知道分享的是什么东西，丝毫没有点击的欲望好不好。

在分享出去的html页面上加上这一段代码，content的值写上想要展示的内容

像飞书、企业微信、WhatsApp、Twitter、Facebook 等社交软件，都会根据链接去抓取给定 URL 的内容，以确定要包含哪些属性来进行共享展示。而抓取的数据就是写的og:tags 来显式定义的属性。

Open Graph Protocol（开放图谱协议），简称 OG 协议。它是 Facebook公布的一种网页元信息（Meta Information）标记协议，属于 Meta Tag （Meta 标签）的范畴，「是一种为社交分享而生的 Meta 标签」，「用于标准化网页中元数据的使用，使得社交媒体得以以丰富的“图形”对象来表示共享的页面内容」。后面其他社交app也纷纷效仿！所以其他app也可以实现这种功能。当然，推特也在基础之上做了拓展，所以需要添加下推特拓展的meta头，让链接预览展示地更加好看

可这仅仅使得该链接的点击率变高了，用户量变高是从何而来的。因为在分享出去的页面中会有个引导用户点击安装app的按钮。用户点击该按钮后，会自动判断用户手机里是否已经安装了该app，如果已经安装app，就会打开app，并且自动在app里调起指向的页面。如果用户没有安装app，那么就会自动引导用户到应用商店里去安装app。当用户安装app之后并且登录之后，就会自动调起指向的页面

appsflyer是一家源于以色列，提供**「数据归因统计」**的服务商，因为与多家平台（包括facebook）有合作关系，所以做境外投放尤其是facebook投放时需要监控下载活跃时会用到他家的服务。这里说的onelink就是经过他们加封装后的deeplink。

那么，到底什么是OneLink™呢？简单来说OneLink可以通过单一链接，自动识别设备系统（安卓／iOS）完成跳转，将用户导向Google Play，App Store，Windows Phone Store，或任意指定的落地页URL。同时，由于与**「深度链接」（deeplink）和「延迟深度链接」（deferred deeplink）的「深度整合」**，OneLink还可以轻松实现将新老用户导入特定的推广页面，大大提升广告效果。

「深度链接的表现」：当用户安装了app时，点击分享页的**「打开app按钮」，这时会直接打开app，并跳转到对应的调起页面「延迟深度链接的表现」** ：当用户未安装app时，点击分享页的**「打开app按钮」，OneLink会迅速识别用户设备类型，并将用户带到正确的应用商店。接下来「延迟深度链接」发挥作用，当新用户下载应用后，AppsFlyer会向设备实时传递包括相关的归因信息，以便App首次打开时自动显示与Campaign信息对应的页面。顾名思义，「延迟深度链接」** 就是延迟到用户安装完app之后再发挥**「深度链接」的作用。URL Scheme是实现深度链接Deeplink兼容性最高、也最简单的一项方法，「原生App可以先向操作系统注册一个URL，其中Scheme的作用是从不同平台唤醒相应App」**。URL Scheme的协议样式如下：Scheme://host:port/path?query

重点关注怎么将onelink引入代码中使用。（一般来说，onelink的配置不是开发来配的）。使用如下所示：

这个就是配置好的onelink的bingobingo.onelink.me/115925328?p…点击这条链接的 用户将打开app或者去到app商店，然后打开写好的target页面，实际上，这里写的target就是一个deeplink。解释一下onelink相关参数：

除了这几个，其实还有其他参数：其中af_ios_url和af_android_url可能会常用到，它们是用于当用户没安装app，并且不希望跳转去应用商店时使用的参数， 就可以跳转到af_ios_url或af_android_url指定的页面。例如：下面这条onelink，当用户没安装app时，并不会跳到应用商店，而是跳转到www.baidu.com页面。bingobingo.onelink.me/115925328?p…

以电商为例，假设广告主已经在OneLink模版中选择跳转至对应商店，但在某个新年广告系列推广活动中，广告主希望用户先来到新年促销详情的落地页，以便传递更丰富的信息，再由落地页导向商店。这个时候，可以通过添加两个简单的参数来覆写，af_ios_url和af_android_url参数。

canonical URL会导致facebook在抓取分享的链接的预览图、标题、描述的时候，会到这条meta声明的url里查找对应的预览图、标题、描述等。所以当分享的链接跟这条meta声明的url不一致时，就会出现显示数据不对的问题。这条meta的作用其实就是利于seo，所以不考虑seo的话，考虑将这条meta删掉。**「canonical」**标签是一种告诉搜索引擎要在搜索结果中显示哪个版本的URL的方法。使用canonical标签可以防止由于相同（或非常相似）或“重复”内容出现在多个URL上而引起的问题。