使用JavaScript和Twitter API加载推文

Loading Tweets using JavaScript and Twitter API

本文关键字：加载 API Twitter JavaScript 使用      更新时间：2024-02-21

我对JavaScript相对较新，决定尝试通过API访问Twitter以获取我的5条最新推文，但我遇到了困难，我将感谢您的帮助。

这是tweets.js代码。我仔细研究了API来形成这个，但不确定它是否正确。

tweets = {
    loaddata: function() {
        $.ajax({
            url: 'https://api.twitter.com/1.1/statuses/user_timeline.json',
            type: 'GET',
            dataType: 'json',
            data: {
                screen_name: 'techybox',
                include_rts: false,
                count: 5,
                include_entities: true
            },
            success: function(data, text) {
                var html = '<li class="tweet">TWEET</li>';
                $('#timeline').append(html.replace('TWEET', tweets(data.text)));
            }
        });
    };
}
$(document).ready(function() {
    tweets.loaddata();
});

理论上，它应该加载5条最新的推文，并将它们与id时间线一起附加到UL。我看到您可能需要OAuth来完成这项工作，但我不确定该如何实现？我说得对吗？Twitter的旧API似乎在没有这一点的情况下工作，只有1.1。可能已经改变了？

最后是我的html页面，它只包含UL:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tweets</title>
</head>
<body>
    <h1>Tweets</h1>
    <ul id='timeline'></ul>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="tweets.js"></script>
</body>
</html>

Twitter更新的API需要oAuth，这需要您编写一个服务器端组件，供javascript使用。

所以这并不是说你的方法是错误的。Twitter只是不希望你再以这种方式获取信息。

请注意，如果你在浏览器中访问API，你会得到一个错误。https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=techybox&计数=3

关于这个主题，这里有一篇非常好的文章：用Twitter API 1.1版检索user_timeline的最简单的PHP示例

在此处中使用oauth 

var oauth = require('oauth.js');
var urlLink = 'https://api.twitter.com/1.1/statuses/update.json';
var twitterStatus = "Sample tweet";
var oauth_consumer_key = "d6T0PcnqxxxxxxxxxxUB7Jok2f";
var consumerSecret = "NFbG1H7CGRxukJTPxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxze02qH8";
var oauth_token = "306673734-RQanTkxxxxxxxxxxxxxxxxxxeH4NuqQ8Z";
var tokenSecret = "YnF5vpjclMMVWhuxxxxxxxxxxxxxxxl3xejqAu";
var nonce = oauth.nonce(32);
var ts = Math.floor(new Date().getTime() / 1000);
var timestamp = ts.toString();
var accessor = {
    "consumerSecret": consumerSecret,
    "tokenSecret": tokenSecret
};
var params = {
    "status": twitterStatus,
    "oauth_consumer_key": oauth_consumer_key,
    "oauth_nonce": nonce,
    "oauth_signature_method": "HMAC-SHA1",
    "oauth_timestamp": timestamp,
    "oauth_token": oauth_token,
    "oauth_version": "1.0"
};
var message = {
    "method": "POST",
    "action": urlLink,
    "parameters": params
};
//lets create signature
oauth.SignatureMethod.sign(message, accessor);
var normPar = oauth.SignatureMethod.normalizeParameters(message.parameters);
var baseString = oauth.SignatureMethod.getBaseString(message);
var sig = oauth.getParameter(message.parameters, "oauth_signature") + "=";
var encodedSig = oauth.percentEncode(sig); //finally you got oauth signature
$.ajax({
    url: urlLink,
    type: 'POST',
    data: {
        "status": twitterStatus
    },
    beforeSend: function(xhr){
        xhr.setRequestHeader("Authorization",'OAuth oauth_consumer_key="'+oauth_consumer_key+'",oauth_signature_method="HMAC-SHA1",oauth_timestamp="' + timestamp + '",oauth_nonce="' + nonce + '",oauth_version="1.0",oauth_token="'+oauth_token+'",oauth_signature="' + encodedSig + '"');  
   },
   success: function(data) { 
        alert("Tweeted!"); 
   },
   error:function(exception){
       alert("Exeption:"+exception);
    }
  });
相关文章：