如何从 (Messenger) 预览中删除脚本代码？

Question

我在 page 上使用 plyr 播放器。基本上页面上唯一的代码是这样的：

<div class="container">
    <div id="player" data-plyr-provider="youtube" data-plyr-embed-id="123123132"></div>
</div>
<script src='https://data1.132231321.cz/124141/users/plyr/plyr.min.js'></script>
<script>
const player = new Plyr('#player', {});
// Expose player so it can be used from the console
window.player = player;
</script>

一切正常。就在我通过 Messenger / whatsapp 将这样的 link 发送给某人时，他们会在预览中看到代码我使用类似于 WordPress 的自定义 CMS，我在其中添加了 plyr 脚本代码 post 正文在HTML代码中。

注意我无法编辑或修改 html 中的头部，只能 div class="container" 在 html体。请参阅 url https://zz.zustatzdravy.cz/skryte/90-test-a.html 。 url 将来可能会起作用。

我用的不是 WP，而是 WP 之类的东西。它是定制的，没有插件。我可以使用自定义 css

有什么方法可以隐藏预览中的代码吗？

更新：Facebook 共享调试器显示了我的意思

Answer 1

我认为添加开放图/元描述会起作用。有关详细信息，请查看 https://ogp.me/

在代码中替换 {{TITLE TO SHOW IN PREVIEW}} 和 {{DESCRIPTION TO SHOW IN PREVIEW}} 的所有实例。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>{{TITLE TO SHOW IN PREVIEW}}</title>
  <meta name="title" content="{{TITLE TO SHOW IN PREVIEW}}">
  <meta name="description" content="{{DESCRIPTION TO SHOW IN PREVIEW}}">

  <!-- Open Graph / Facebook -->
  <meta property="og:type" content="video.other">
  <meta property="og:title" content="{{TITLE TO SHOW IN PREVIEW}}">
  <meta property="og:description" content="{{DESCRIPTION TO SHOW IN PREVIEW}}">
</head>
<body>
  <div class="container">
    <div id="player" data-plyr-provider="youtube" data-plyr-embed-id="123123132"></div>
  </div>
  <script src='https://data1.132231321.cz/124141/users/plyr/plyr.min.js'></script>
  <script>
  const player = new Plyr('#player', {});
  // Expose player so it can be used from the console
  window.player = player;
  </script>
</body>
</html>

此外，我建议在 og:description 元标记下方添加以下内容。

<meta property="og:url" content="{{ URL OF PAGE }}" />
<meta property="og:image" content="{{ PREVIEW IMAGE }}">

{{ URL OF PAGE }} 在这种情况下是当前的 URL... 所以如果 url 是 https://example.com/thevideo 那么 og:url 的内容将是 https://example.com/thevideo
{{ PREVIEW IMAGE }} 显示为预览的可选图像文件。这是完整的 url 域，例如https://example.com/img/preview.jpg

您可以使用Facebook Sharing Debugger工具进行测试。

您提到您正在使用 CMS。您可能需要找到一个插件来修改 meta header 标签。在 WP 中你可以使用像 Yoast SEO.

这样的东西

Update based on only being able to update the body: 看起来在你的特定情况下，CMS 已经添加了 og:title 和 og:description。 og:title 是页面标题，描述是页面上的一段文字。

使用开放图标签确实是您修改邮件预览中显示的标题、描述和图像的唯一方法。因此，理想情况取决于您使用的 CMS。

解决方案 1：将 javascript 移动到文件。

以下代码未添加到描述中：

<script src='https://data1.azami.cz/124141/users/plyr/plyr.min.js'></script>

因此，如果您可以使用 const player = new player... 代码创建另一个 javascript 文件，那么您还可以包含一个与此类似的标签：

<script src='https://data1.azami.cz/124141/users/plyr/a_new_file_with_script.js'></script>

使用解决方案 1。描述现在应该是空的。

解决方案 2：在 body

前添加说明

如果由于某种原因你不能在服务器上创建一个新文件，你真的可以只修改 body，那么现在我唯一能想到的就是绕过它这将添加一个新的描述，但可能不会从描述中删除 javascript 代码。除非这个新描述超过 300 个字符。

黑客在包含视频的脚本标签之前添加了类似于下面的代码。它的描述在查看网站时会被隐藏，但会在描述标签前添加。

<div style="display: none">Here you can put a description of a video. Or a general description for the website. It will be displayed as the description when sharing via messenger. Maybe if you make this 300 characters or longer, then the script won't show up in the description. This text including this note is 300 characters.</div>

如何从 (Messenger) 预览中删除脚本代码？

How to remove script code from (Messenger) preview?

html

facebook-messenger