Question

有没有人知道如何在pinterest.com中实现类似“PIN IT”按钮的内容？从高层次来看，我理解它的作用但不详细。单击“pin it”书签，然后刮取站点源代码以找出宽度和高度大于某个阈值的图像。抓取页面源以查找图像可以在客户端或服务器端进行。实现类似目标的最佳方式是什么？

有人可以深入了解他们的实施吗？

Answer 1

实际上这种书签通常会这样做：

当您点击书签时，它将通过重定向到以下网址来运行JavaScript代码：

javascript: void((function () { SOME_CODE })());

然后SOME_CODE将执行。在这种情况下，Pin it按钮将运行如下：

javascript: void((function () {
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('charset', 'UTF-8');
    e.setAttribute('src', 'http://assets.pinterest.com/js/pinmarklet.js?r=' + Math.random() * 99999999);
    document.body.appendChild(e)
})());

最终会在文档正文中添加新标记。 Pin它将添加“pinmarklet.js”文件。请注意，“？r ='+ Math.random（）* 99999999”部分仅用于通过每次随机生成新数字从客户端传递缓存来获取。

如果您想确切了解接下来发生的事情，那么您需要查看他们的JavaScript源代码。但是很容易看到DOM并抓住你想要抓取的东西（图像，视频链接......）并应用你的逻辑。

我希望这会有所帮助： - ）

Answer 2

我在javascript上创建了一个函数来共享自定义图像，并通过pinterest传递您想要分享的图像的来源。

代码：https://github.com/mustaine/Pinmarklet

我希望它有所帮助。

“Pin It”按钮源代码（pinterest.com）

2 个答案: