parsing - 通过URL解析(如WhatsApp，Viber，Skype)制作漂亮的代码段

Question

我们在我们的网站上聊天，并希望对其进行改进。用户经常互相发送指向新闻站点，文章，YouTube视频等的链接

我们希望将这些链接转换为带有一些信息(也称为“代码段”)的精美图片
这是例子

例如，facebook聊天:http://c2n.me/3z442bv.jpg
Skype:http://c2n.me/3z44a60.jpg

但是这意味着要编写自己的解析器，这是一项复杂的任务。是否有现成的图书馆，提供此类服务的站点？

谢谢!

Answer 1

您可以使用开放图解析器
例如(在JQuery中打开图形解析器)，您可以找到许多其他解析器
https://github.com/fiann/jquery.ogp

如今，大多数网站都使用开放式图形标签。

编辑
(来自github存储库的插件代码)

    (function($) {

  var checkNamespacePresent = function (node) {
    console.log("Checking for namespace on node", node);
    var i, attr, attributes = node.attributes || {};
    // we're looking for xmlns:og="http://opengraphprotocol.org/schema/"
    for (i = 0; i < attributes.length; i++) {
      attr = attributes[i];
      if (attr.nodeName.substring(0,5) === "xmlns" && 
          attr.nodeValue === "http://opengraphprotocol.org/schema/") {
        return attr.nodeName.substring(6);
      }
    }
    return null;
  }

  $.fn.ogp = function() {
    var ns = null, data = {};
    $(this).each(function () {
      $(this).parents().andSelf().each(function () {
        ns = checkNamespacePresent(this);
        console.log("Found %s on", ns, this);
        if (ns !== null) {
          return false;
        } 
      });

      // give up if no namespace
      if (ns === null) {
        console.log("No namespace found");
        return null;
      }

      // look for OGP data
      ns = ns + ":";
      $('meta', this).each(function () {
        console.log("Looking for data in element", this);
        var prop = $(this).attr("property"), key, value;
        if (prop && prop.substring(0, ns.length) === ns) {
          key = prop.substring(ns.length);
          value = $(this).attr("content");
          console.log("Found OGP data %s=%s", key, value);
          data[key] = data[key] || [];
          data[key].push(value);
        }
      });
    });

    // this is the total of everything
    console.log("All the data is ", data);

    return data;
  }
})(jQuery);