Facebook链接预览如何发生？

当您在Facebook中键入URL时，它会自动提供“发布链接”function。对于大多数网站，它会自动加载从页面某处拉出的一系列图像，以与链接和描述一起使用。有没有人知道如何为我们自己的网站实现相同的function，没有任何FB API等..只是javascript或JQuery？

由于安全限制，JavaScript无法从任何服务器加载任何页面。 Facebook实际上要求Facebook服务器提供有关该页面的信息，然后服务器依次查询页面以提取信息。您也需要服务器端实现此function。

除此之外，它非常简单：使用HTTP客户端库为您选择的语言连接到提供的URL，然后使用HTML解析库提取title标记，识别body标记中的重要文本，并提取似乎最合适的img标记源。

一旦您的服务器能够提取有关页面的信息，通过AJAX调用它是一个相当简单的练习。

@Keshan。

我在我的网站上开发了一个带有PHP和jQuery的Facebook链接预览版。看看……源代码是免费的…我没有在这里发布整个代码，因为它们是很多文件…但是如果您更喜欢在这里发布代码，请告诉我，我会发布。

它可以在Github上获得https://github.com/LeonardoCardoso/Facebook-Link-Preview

Facebook链接预览 – PHP + jQuery

我认为涉及以下步骤

使用Javascript查找书面文本中的链接
从找到的链接获取文本中的最后一个链接（FB仅显示最后一个链接）
使用AJAX将此链接详细信息发送到服务器端页面（PHP / ASP / JSP等）
服务器端页面获取所需数据（来自Meta标签），包括
- 标题（最好是打开图表og:title如果缺少
- 描述（最好是打开图表og:description如果从丢失了
- 图像（最好是打开图形og:image如果从
在PHP中，您可以使用curl或file_get_contents获取这些数据，并解析上面详述的所需数据。不确定其他语言。
显示在AJAX请求中找到的结果。

另外我认为FB一旦找到数据就存储在数据库和第一次查询中。这有助于他们获得更快的结果，因此同一篇文章共享和喜欢从存储的数据生成图像和细节。

您将需要Javascript在运行时显示此预览（当您在textarea中写入时）。但是，如果您在发布数据后只需要它，可以使用纯服务器端语言（您可以避免使用javascript）来完成，并按照上述步骤删除AJAX调用。

令人惊讶的是，那里没有那么多服务。正如之前的评论者发布的那样，如果没有服务器元素，您的浏览器就无法做到这一点。

所以，工作流程就是这样的：

如果您不打算创建服务器对象，则可以使用第三方服务来执行检索位：

祝你好运。