Question

如何对链接的跨域 HTML页面执行ajax调用并获取此链接页面的元标记内容？

目标是从任何可能的网址/网站获取OpenGraph-Image的网址 - 正如Facebook或Google+所做的那样。我提供了URL（decURL），然后脚本应该从此远程URL /页面的元数据中获取og：image-URL。

以下代码仅适用于相同的域/本地 - 但我需要它跨域工作，因此我可以输入任何URL，脚本将为我提供og：image ...

    $.get(decURL, function(data){
      var $ogImage = $(data).filter("meta[property='og:image']").attr('content');

      $imgPlaceholder.prepend($articleImage.attr('src',$ogImage));
      $imgField.val($ogImage);
    });

Answer 1

出于安全原因，这类功能受到大多数浏览器的有意限制（请参阅Same Origin Policy，其中包含一些旨在限制的攻击类型 - XSS和CSRF - 以及绕过它的方法，包括CORS，如果你能控制两个服务器环境的话。）

由于您不属于本书可以做的事情，通过实施CORS等，您必须走很远的路。基本上，为了能够获取任何站点的元数据，您需要从服务器获取。

在这种情况下，服务器实际上是一个客户端，因此不受这些策略的限制（这听起来令人困惑，但基本上服务器要求另一台服务器提供与浏览器客户端完全相同的页面）。

根据您要执行的操作，您可能希望将其作为代理或单独的应用程序。

作为一个独立的应用程序，您可以编写一个在某个服务器上运行的简单脚本，并为您扫描，将结果放在您自己的环境中的数据库中，您的浏览器可以访问该数据库（这或多或少都是这样的Facebook做到了。）

作为代理，您可以编写类似的脚本，但不是由cron作业或基于时间的触发器触发，而是将结果保存在数据库中，它将由前端的请求触发，转到另一页，扫描元数据，然后将其返回给浏览器客户端。

这样做的主要缺点是，每当您要求提供某些内容时，您就会在服务器上施加额外负载，这意味着您需要注意不要使主机环境过载。这可能是为什么FB等沿着“服务器应用”路线走下去的原因。

这听起来像是一种痛苦，但它实际上是非常简单的，如果你想要能够扫描任何东西，而不仅仅是你制作的东西或者可以让人们配置，那么真的没有其他选择。

jQuery AJAX：从跨域HTML页面获取元数据

1 个答案: