Question

在我的网站上，用户在注册时输入他们的Twitter用户名，并且他们的时间线嵌入在他们的个人资料页面上。到目前为止，我已使用以下JavaScript代码实现了此目的：

<script type="text/javascript">

    var twitterUsername = // read from database

    new TWTR.Widget({
        version: 2,
        type: 'profile',
        rpp: 4,
        interval: 30000,
        width: 'auto',
        height: 210,

        features: {
            scrollbar: true,
            loop: false,
            live: false,
            behavior: 'all'
        }
    }).render().setUser(twitterUsername).start();
</script>

最近我注意到JavaScript控制台中出现了以下消息

TWITTER WIDGET：此小部件已弃用，并将很快停止运行。 https://twitter.com/support/status/307211042121973760

TWITTER WIDGET：您可以从https://twitter.com/settings/widgets/new/user?screen_name=electricpicnic
获取新的升级小部件

似乎我应该使用嵌入式时间轴而不是使用此小部件。但是，文档似乎建议，为了在页面中嵌入时间轴，您需要转到widgets section of your settings page并为每个用户设置要嵌入其时间轴的小部件。 Twitter为您提供了将此时间轴嵌入页面的代码，但此代码包含一个属性data-widget-id="275025608696795138"，每个用户都有不同的值。

显然这种方法对我不起作用，因为我不可能为我的所有用户（现在和将来）设置一个小部件，并为每个用户存储data-widget-id。是否有一些非弃用的方式我可以嵌入时间轴，这允许我在运行时提供Twitter用户名？

更新

根据Twitter开发讨论组中的this post，此功能目前不可用，但将在未来版本中提供。

Answer 1

Twitter正在弃用未经身份验证的小部件。你将无法再使用它们了。

但Twitter有一个可以调用的API，您可以生成自己的自定义推文时间轴UI而无需使用它们的小部件。有关UI的示例，请参阅http://tweet.seaofclouds.com/。

但您还必须知道，您无法直接从Javascript调用其API，因为他们的API具有OAuth。您只能从服务器端代码调用它们的API（我不知道您现在使用的是什么，PHP / Ruby / Python / Java？）。好消息是，OAuth是一个开放标准，您可以使用任何语言调用其API。 Here is an example of the same widget，但它通过使用PHP调用API来获取数据。这是一个长期的解决方案。

如果Twitter时间轴对您的网站至关重要 - 那么您必须采用API方式。您必须register your site with Twitter，然后使用OAuth获取用户的时间轴数据，并使用该数据呈现javascript小部件。

Answer 2

使用新的Twitter小部件，just create来自您自己帐户的经过身份验证的Twitter小部件（例如YourName）。然后设置要显示的用户的数据屏幕名称（例如“twitterUsername”），最后得到如下内容：

<a class='twitter-timeline'  href='https://twitter.com/YourName'  
   data-widget-id='your-widget-id' 
   data-screen-name='twitterUsername'>Tweets by @twitterUsername</a>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)  [0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','twitter-wjs');</script>

Answer 3

这里有一些JavaScript，可用于在网页中嵌入用户的时间轴

添加脚本https://www.tweetjs.com/tweetjs.js

然后添加代码：

   TweetJs.ListTweetsOnUserTimeline("PetrucciMusic",
    function (tweets) {
        for(var i in tweets)
        {
            document.write(tweets[i].text + "<br>");
        }
    });

...尽管我建议使用比这更好的样式：）

Answer 4

这就是我使用它的方式，感觉相当不错。

HTML：

    <ul id="twitter_update_list">
    </ul>

脚本：

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=theunexpected1&callback=twitterCallback2&count=10"></script>

注意＆＃34; screen_name＆＃34;变量发送到脚本。您可以自定义回调函数（blogger.js），也可以在本地保存此文件以避免外部请求。

希望这很有用。

作为参考，我在这里创建了一个 jsfiddle ，你可以从那里获取CSS片段。 http://jsfiddle.net/rahulsv/8fRTD/

<强>更新

自从Twitter更新到v1.2后，此解决方案不再有效 - 未经授权访问推文。

在网页中嵌入Twitter用户时间线

更新

4 个答案: