1

我目前正在研究数据库上做一些工作，他们决定希望能够在社交网络（Facebook、Twitter、LinkedIn 和 Google+）上分享该网站的文章链接。

这最好通过各自网络提供的共享按钮来完成。通过遵循每个网络的实施说明，我很快让按钮正常工作并在网站上正确显示。

我的问题是该网站提供了在单个搜索结果页面上显示 1000 (1K) 个帖子的可能性。这意味着当创建这样一个页面时，它需要为每个社交网络创建 1000 个共享按钮（实际上是 4000 个）。

可悲的是，这似乎压倒了浏览器，因为它提供停止社交网络提供的 javascript 以及您是否选择停止它 - 页面最终陷入僵局，等待来自社交网络的响应并且永远不会完成页面加载过程.

我有一个想法，问题可能是大量的异步请求意味着浏览器以某种方式错过了一些响应，因此最终永远等待一个永远不会到来的响应。

如前所述，只有如此大量的帖子才会出现问题，例如，如果一个页面显示 100 个帖子（实际上是 400 个分享按钮），它就可以完美运行。

虽然有人可能会说单页上 1000 个帖子是多余的，但遗憾的是，限制显示帖子的最大数量并不是一种选择。

因此，我的问题是你们中是否有人知道解决此类问题的方法，或者我唯一真正的选择是创建不需要通过社交网络提供的 javascript 创建的自定义共享按钮？

以下参考指向每个共享按钮的文档。

4

1 回答 1

3

对于所有这些按钮，有一个主要的 js 文件来完成繁重的工作。因此，对于 LinkedIn，添加脚本标签：

<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>

一次在页面中。并在需要时使用以下脚本作为linkedin 按钮的占位符。（不要忘记替换data-url下面脚本中的属性）

<script type="IN/Share" data-url="http://developer.linkedin.com/plugins/share-plugin-generator" data-counter="top"></script>

类似地，对于 Twitter，下面的脚本标签需要在页面中添加一次，因为它的工作是获取主 js 文件并将其添加到页面中。

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

下面的脚本需要在任何你想要的地方多次添加。将 data-url 属性替换为您单击它时需要发送推文的 url。

<a href="https://twitter.com/share" class="twitter-share-button" data-url="https://dev.twitter.com" data-via="your_screen_name" data-lang="en">Tweet</a>

当您获得FB或Google Plus之类的代码时，您将获得一个需要添加一次的脚本，然后将代码添加到您需要的任何地方。

编辑： 根据您在下面的评论：脚本肯定会引起问题，因为它们需要将每个占位符转换为一个好看的“喜欢”按钮。以下是一些提高性能的方法：

  1. 仅在页面加载时运行这些脚本（即，在加载时添加主脚本）
  2. 使用setTimeoutor setInterval，一次处理每 100 个占位符（需要更改主脚本）
  3. Lazy load the init of like buttons. When the user scrolls the page and the like buttons will show up in the page, then initialize the buttons (requires change in main scripts)
  4. Recommended Approach: Keep just one set of like buttons. When user hovers over a search result, then add this set of buttons to that div and change the attributes related to url in the buttons. With this way, only one set of buttons will be shown and won't take time at all to init them.
于 2012-04-14T11:20:13.127 回答