branch.io 生成的链接中有额外的 HTML 元数据标签

Question

我们正在使用分支为我们的应用程序生成动态 link。我们在各种社交媒体平台上使用这些 link。分支配置选项使我们能够填充固定的开放图形数据集。对于视频，它允许我们设置 og:video，但无法设置 og:video:type。因此，如果您使用 HTML5 视频，则视频嵌入不起作用，因为 Facebook 的默认视频类型是 application/x-shockwave-flash。

我在配置 link 时尝试传递额外的数据，但它没有转换为 Facebook 废弃的 HTML 元标记。

Answer 1

当一个 Branch link 被抓取时，Branch 将 return：第一个：为 link 定义的任何参数；第二：尚未为 link 定义但已在应用级别定义的任何参数（在 Link 设置页面的社交媒体显示自定义中）；最后：在默认 URL ($fallback_url) 页面中指定的网站上存在的任何元标记。

因此，即使 Branch 没有提供用于定义 og:video:type 的明确参数，您也应该能够通过将元标记添加到您用作 $fallback_url 的网页来实现此目的.

这是一个例子：

我从下面的 link "https://ogt1.app.link/fallbackurltags" 开始，我在下面设置了参数（请注意，显示 "" 是因为我没有为 [=49= 设置任何 OG 参数]).请注意，我已经设置了 $fallback_url:

{
"$desktop_deepview": "",
"$desktop_url": "",
"$fallback_url": "https://dwestgate.github.io/ExampleFallBackURL/",
"$marketing_title": "OG Tag Testing - fallback URL tags",
"$og_description": "",
"$og_image_url": "",
"$og_title": "",
"$one_time_use": "",
"~creation_source": 1,
"~feature": "marketing",
"~id": "357178398369800081",
"~marketing": true
}

"og:video:type=application/x-shockwave-flash" 尚未在 Branch 仪表板上的任何位置或作为 link 参数看到。

不过，我已将元标记添加到我创建并分配为 $fallback_url: https://dwestgate.github.io/ExampleFallBackURL/ 的简单网站。这是该网页：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="title" content="Tag set by Fallback URL" />
  <meta name="description" content="Tag set by Fallback URL" />
  <meta property="og:title" content="Tag set by Fallback URL" />
  <meta property="og:video:url" content="http://www.youtube.com/v/CsGYh8AacgY?version=3&autohide=1" />
  <meta property="og:video:type" content="application/x-shockwave-flash" />
  <meta property="og:video:width" content="160" />
  <meta property="og:video:height" content="90" />
  <title>Fallback URL with meta tags</title>
</head>
<body>
  <h1>All the action is in the meta tags - View Source</h1>
</body>
</html>

当我现在浏览到 Facebook 的共享调试器时（此处：https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fogt1.app.link%2Ffallbackurltags）- 瞧：该网页的 og:video:type 标签已被抓取。您可以通过单击 "Show All Raw Tags" 按钮查看 return 编辑的原始标签。

我没有提到的一件事可能会把事情搞砸：如果为 $og_url 提供了一个值，则只会显示该值中提供的网站标签。例如linkhttps://ogt1.app.link/linktags，参数如下：

{
"$marketing_title": "OG Tag Testing - per-link tags",
"$og_description": "OG Tags set at the link level",
"$og_image_height": "200",
"$og_image_url": "https://cdn.branch.io/branch-assets/1486394827408-og_image.png",
"$og_image_width": "200",
"$og_title": "Per-Link tags",
"$og_url": "https://dwestgate.github.io/ExampleFallBackURL/",
"$og_video": "https://www.youtube.com/v/CsGYh8AacgY",
"$og_video_height": "180",
"$og_video_width": "320",
"$one_time_use": "",
"~creation_source": 1,
"~feature": "marketing",
"~id": "357170874539266599",
"~marketing": true
}

在这种情况下，link 参数被 $og_url 中的参数覆盖，再次检查 Facebook Sharing Debugger 可以看出这一点（此处：https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fogt1.app.link%2Flinktags）：

<meta charset="utf-8" />
<meta name="title" content="Tag set by Fallback URL" />
<meta name="description" content="Tag set by Fallback URL" />
<meta property="og:title" content="Tag set by Fallback URL" />
<meta property="og:video:url" content="http://www.youtube.com/v/CsGYh8AacgY?version=3&autohide=1" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="160" />
<meta property="og:video:height" content="90" />

我希望这提供了足够的清晰度，让您能够填充任何需要的自定义 OG 标签。

Answer 2

根据分支文档，可以选择添加 custom meta tags。只需将默认不支持的每个元标记放入其中即可。

$custom_meta_tags: '{"og:video:type": "application/x-shockwave-flash"}'

branch.io 生成的链接中有额外的 HTML 元数据标签

Extra HTML meta data tags in branch.io generated links

branch.io