需要一个简单的Twitter API v1.1示例，使用jQuery或C# ASP.NET显示时间线。

Question

随着Twitter于2013年6月11日关闭API 1.0，我们有几个网站现在无法显示时间轴。我一直在寻找一个“如果你这样做了，现在就要这样做”的例子。以下是Twitter的公告。 https://dev.twitter.com/blog/api-v1-is-retired 以下是我们最初通过API 1.0显示Twitter时间轴的方法。

<div id="twitter">
    <ul id="twitter_update_list"></ul>
    <script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
    <script type="text/javascript" src="http://api.twitter.com/1/statuses/user_timeline/companytwitterhandle.json?callback=twitterCallback2&amp;count=1"></script>
    <div style="float:left;"><a href="https://twitter.com/companytwitterhandle" target="_blank">@companytwitterhandle</a> | </div>
    <div class="twitterimg">&nbsp;</div>
</div>

起初，我尝试更改JavaScript引用URL中的版本，但没有成功。

<script type="text/javascript" src="http://api.twitter.com/1.1/statuses/user_timeline/companytwitterhandle.json?callback=twitterCallback2&amp;count=1"></script>

然后我看了Twitter API文档（https://dev.twitter.com/docs/api/1.1/overview），但缺乏明确的转换示例。我没有4或5个小时深入研究，也不想去看这个杂乱无章的FAQ（https://dev.twitter.com/docs/faq#17750）。

然后我发现了有关用户时间线的API文档。所以我再次更改了URL，如下所示。 https://dev.twitter.com/docs/api/1.1/get/statuses/user_timeline

<script type="text/javascript" src="https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=companytwitterhandle&amp;count=1"></script>

那不起作用了。

使用jQuery或C# ASP.NET MVC，我如何将接口从Twitter API 1.0过渡到Twitter API 1.1？如果可能的话，我的首选是浏览器客户端实现。请提供一个代码示例。谢谢。

- Ken Palmer

Answer 1

好的，我从一位同事那里得到了答案，他在我们公司进行了类似的更改。这是编码解决方案。他从我们承包建立新接口和 Twitter 时间线的公司那里得到了这个。

<a class="twitter-timeline" href="https://twitter.com/companytwitterhandle" data-widget-id="18DigitMagicNumber" data-chrome="nofooter transparent noscrollbar noheader noborders"  data-tweet-limit="1" >Tweets by @@companytwitterhandle</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>

在 data-widget-id 属性中，您将看到 18DigitMagicNumber。该数字显然与我们的 Twitter 句柄或公司有关。我不知道它是如何生成的。

正如所示，一家承包公司为我们编写了该代码，因此我不会试图解释它正在做什么。

我将其从一个站点剪切并粘贴到另一个不相关的站点，它立即起作用。我唯一更改的是删除实际公司句柄和 data-widget-id，并将单个 @ 替换为 @@ 以在 MVC 中转义它。

希望这能帮助一些正在迁移到 Twitter 1.1 的人。谢谢。

- Ken Palmer

---

这个使用纯JavaScript而不是OP请求的jQuery，似乎无法工作。https://jsfiddle.net/3xsjn59u/ - Wes Modes

@WesModes，我是原帖发布者，当时这段代码是可行的。现在帖子已经快三年了，所以可能已经过时了。不过没必要给它点踩 :) - Ken Palmer

另外需要注意的是，小提琴示例中将字符串“18digitmagicnumber”分配给data-widget-id，而不是真正的Twitter号码。您需要一个真实的Twitter帐户号码才能使该代码示例正常工作。在之前的雇主那里，我认为公布这些信息是不明智的。 - Ken Palmer

Answer 2

这是我做的方法：

请看我的问题和答案：

使用Twitter API 1.1 oAuth验证并请求用户时间线

使用上述解决方案并将json呈现回页面，将其存储在名为json的变量中。

引用jQuery和twitter-text js库；

https://github.com/twitter/twitter-text-js

在你的aspx中添加一个带有id或结果的div：

 <div id="results"></div> 

您可以使用以下JavaScript渲染内容：

for (var i = 0; i < json.length; i++) {
                $("#results").append('<div class="tweet"><p><span><strong> - ' + json[i].created_at.substring(0, 16) + '</span></strong></span><br/>' + twttr.txt.autoLink(json[i].text) + '</p>');
                try {
                    for (var j = 0; j < json[i].entities.media.length; j++) {
                        $("#results").append('<a href="' + json[i].entities.media[j].media_url + '"><img src="' + json[i].entities.media[j].media_url + ':thumb" /></a>');
                    }

                } catch(e) {
                }
            }

- hutchonoid

Answer 3

创建一个仅使用JavaScript的解决方案，可以在不使用新API的情况下立即在您的网站上获取Twitter帖子 - 样式由您自己决定 - 现在还可以指定推文数量：

http://goo.gl/JinwJ

- Jason