WEBOPIXEL

2012年10月 Twitter APIの変更によりjQueryでつぶやきが表示できなくなったので解決策

Posted: 2012.10.11 / Category: javascript / Tag: , ,

このブログでjQueryでTwitter APIを使用する方法をいくつか紹介してきましたが、2012年10月現在、今までの方法が使用できなくなりました。
とりあえずの解決策です。

Sponsored Link

今までタイムラインはこのように取得していましたが。

http://twitter.com/statuses/user_timeline/xxxxxxxxxxxxxxx.json

こうなります。

https://api.twitter.com/1/statuses/user_timeline.json?screen_name=xxxxxxxxxxxxxxxxx

リクエストURLに「1」と書いてありますが、これはTwitterAPIのバージョン1を使用しているということです。
すでに2013年3月にはバージョン1も停止するとアナウンスされているので、この方法も以降は使用できなくなります。
緊急で対応しなくてはいけない場合のみご使用ください。

今後は1.1を使用してください。

今後はすでに公開されているバージョン1.1を使用することになります。
1.1ではすべてのリクエストにOAuth認証が必要になりますので、ちょっと大変ですね。
またウェイジェット版も新しいものが出ているので切り替える必要があると思います。

PHPでの実装方法はこちら

PHPでOAuth認証して自分のつぶやきを表示する [Twitter API 1.1 対応版]

コード

一応サンプルです。

demo

html

	<div id="twitter"></div>
	

javascript

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script type="text/javascript" src="../../js/php_date.js"></script>
	<script type="text/javascript">
$(function() {
	//IE対策
	function replaceTwTimeStr(time){
		var tArray = time.split(" ");
		var timeStr = tArray[0] + " " + tArray[1] + " " + tArray[2] + " " + tArray[5] + " " + tArray[3] + " " + tArray[4];
		return timeStr;
	}
	var dateObj = new Date;
	$.getJSON('https://api.twitter.com/1/statuses/user_timeline.json?screen_name=xxxxxxxxx&callback=?', function (json) {
		$(json).each(function(i){
			var text = json[i].text;
			//URLにリンクを付ける
			text = text.replace(/(s?https?://[-_.!~*'()a-zA-Z0-9;/?:@&=+$,%#]+)/gi,'<a href="$1">$1</a>');
			//ハッシュタグにリンク
			text = text.replace(/#(w+)/gi,'<a href="http://twitter.com/search?q=%23$1">#$1</a>');
			//リプライにリンク
			text = text.replace(/@(w+)/gi,'<a href="http://twitter.com/$1">@$1</a>');
			$("#twitter").append("<div><p>" +
				text +
				"</p><p class='date'>" + dateObj.format('Y-m-d H:i:s', replaceTwTimeStr(json[i].created_at))  + "<p></div>"
			);
		});
	});
});
	</script>
	

「screen_name=xxxxxxxxx」は表示するTwitterのアカウントに変更してください。

php_date.js に関してはこちらの記事を参考にしてください。

jQueryでTwitterの自分のつぶやきを表示する

COMMENTS

yusuke 2012-12-29 20:57 

はじめまして!質問させてください。
サンプルのコードをコピペしてサーバーにあげているのですが、
なにも表示されません。
サンプルではjqueryは絶対パスで書かれてるし、ユーザーは自分の名前に変更しております。こちらoauth認証の手続きをしないといけないのでしょうか?
コピペで問題ないと思ったのですが・・・
初歩的な質問で申し訳ないのですがアドバイス頂けると幸いです><

webOpixel 2012-12-30 12:39 

まだ使用できるはずですが、正規表現の部分で打ち直さない部分があるかもしれません。
DEMOの方からコピーしてもらえば確実だと思います。

ただもうじき使用できなくなる可能性がありますので、
PHPになりますがOauth認証で表示する方法も参考にしてください。
http://www.webopixel.net/php/666.html

LEAVE A REPLY

コードを書く場合は<pre>で囲んでください。