推特的“关注按钮”小部件是否有回调选项答案

【问题标题】：is there a callback option with twitter's "follow button" widget推特的“关注按钮”小部件是否有回调选项
【发布时间】：2010-11-30 00:09:40
【问题描述】：

我正在使用this 在我的 twitter 网络应用程序上创建 twitter 关注按钮。实现就这么简单：

<span id="follow-twitterapi"></span>
<script type="text/javascript">

  twttr.anywhere(function (T) {
    T('#follow-twitterapi').followButton("twitterapi");
  });

</script>

当您将该代码放入您的 html 文档时，您会在 iframe 的 span 元素中获得此按钮：

点击关注后，您会得到以下信息（或类似的信息表明您正在关注@someone）：

但是，使用此按钮后，我无法将任何信息返回给我的应用程序，（因为这是在 iframe 中呈现的，并且由于 javascript 的同源策略，我无法访问该 iframe 的内容），这个小部件是否提供了任何方法，以在用户开始使用此小部件时通知我的应用程序？

谢谢。

【问题讨论】：

标签： javascript twitter

【解决方案1】：

你可以。这是我的代码：

<a href="https://twitter.com/gafitescu" class="twitter-follow-button">Follow @gafitescu</a>    
 <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
<script type="text/javascript">
    twttr.events.bind('follow', function(event) {
        console.log(event);
        var followed_user_id = event.data.user_id;
        var followed_screen_name = event.data.screen_name;
    });
</script>

【讨论】：

【解决方案2】：

您可以尝试使用 JSONP 来克服跨域限制。

您可以设置一个变量来检查最后一次计数并查看如果它增加了（当然，这可能是由于有人不使用您的应用程序而增加了它，但不确定您是否需要它）。

$.getJSON('http://api.twitter.com/1/followers/ids.json?screen_name=brettz9&callback=?',
    function (obj) {
            // Shows the follower ids
        alert(obj);
    }
);

或者只检查关注者数量：

$.getJSON('http://api.twitter.com/1/users/show.json?screen_name=brettz9&callback=?',
    function (obj) {
        alert(obj.followers_count);
    }
);

您只需将跟随图像直接包含在链接中并设置一个 onclick 事件，如果单击该事件，将交换图像并开始使用 setInterval 轮询以检查是否追随者数量发生了变化。或者，如果您想使用小部件来利用其用户意识，您也可以进行投票。

【讨论】：

对，这是一种我认为在 twttr.anywhere 库中具有这种机制的解决方法，它显然很糟糕。
我不明白为什么应该使用它而不是回调。也许在编写此答案时回调不可用？

【解决方案3】：

您可以使用以下代码。你会得到

关注！

点击关注按钮后提醒

<html>
<a href=http://twitter.com/directdialogs class="twitter-follow-button"
data-show-count="true">Follow@directdialogs</a>
<script type="text/javascript" charset="utf-8">
  window.twttr = (function (d,s,id) {
    var t, js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
    js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
    return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
  }(document, "script", "twitter-wjs"));
</script>
<script>
twttr.ready(function (twttr) {
  twttr.events.bind('follow',   function(e) {
     alert("FOLLOW!")
  });
});
</script>
</html>

【讨论】：