FlashでTwitterの発言を取得してみる 
世界最大のつぶやき共有サービス「Twitter」での発言を取得してみるテスト。
APIが公開されているのですが、
今回はTwitterユーザー全員の発言情報を5秒おきに最新10件表示するというものを作ってみました。
読み込みのフォーマットはXML、JSON、RSS、Atomのフォーマットで情報を使うことができます。
今回はXMLで読み込みます。以下、API仕様をざっくりと書きました。
Twitterユーザー全員の発言情報（最新20件）
http://twitter.com/statuses/public_timeline.xml
友達の発言情報（最新20件）
http://twitter.com/statuses/friends_timeline/自分のユーザーネーム か IDナンバー.xml
自分の発言情報（最新20件）
http://twitter.com/statuses/user_timeline/自分のユーザーネーム か IDナンバー.xml
自分の友達のリスト情報
http://twitter.com/statuses/friends/自分のユーザーネーム か IDナンバー.xml
followしてくれているユーザーリスト情報
http://twitter.com/statuses/followers/自分のユーザーネーム か IDナンバー.xml
Twitterもクロスドメインポリシーの関係でFlashからはAPIに接続できないのでPHP経由で取得してきます。
こちら のPHPソースを参考にして
var xmlURL:String = "crossdomain-proxy.php?url=http://twitter.com/statuses/public_timeline.xml";
xmlLoader = new URLLoader();
xmlLoader.load(new URLRequest(xmlURL));
のように取得すればＯＫです。
【2009/9/15追記】
ソースをアップしました。
alt
[...] だいぶ前にTwitterのしょっぱいFlashサンプルを作ったのですが ちゃんと形になるものを作ろうと思い、いろいろ調べながらやってみたのが GoogleMapsとTwitterのマッシュアップコンテンツ [...]
はじめまして。
当方フラッシュの勉強をしておりまして、アクションスクリプトにてtwitterの投稿を読み込んで表示させようと試行錯誤しているのですが、うまくいきません。。
よろしければ、
http://blog.alt-scape.com/swf/twitter1.swf
のソースを教えていただけませんでしょうか。とても良い感じに動作していて、非常に興味があります。
＞bisaijin 様
はじめまして。
ビジュアル的にも円状に発言を出すだけのテストケースなので
参考になるかどうかわかりませんが一応、ソースをアップしておきました。
プロキシファイルも同封してあります。
こちらからダウンロードしてくださいませ。
http://blog.alt-scape.com/swf/twitter_sample.zip
Google CodeにはTwitter APIのAS3.0用のライブラリもあるので
自力でやるよりはこれ使ったほうが楽かもしれませんね。
http://code.google.com/p/twitterscript/
[...] どの変更）を行うことによって、ビジュアルシンキング、マインドマップの作成を行う。 （参考にさせていただきます。FlashでTwitterの発言を取得してみるhttp://blog.alt-scape.com/archives/234） [...]
表示できました。
素晴らしいサンプルありがとうございます。
横からソースを拝見させて頂きました。
こちらのサンプルコードを参考にウェブページを作成させて頂きました。
twitter flashの取得を理解するのに非常に役に立ちました。
どうもありがとうございます。
[...] めにデータを中継するPHPを置くなどの対策が必要となるのでした。 以下参考にさせていただきました。 FlashでTwitterの発言を取得してみる No Comments Tags: API, AS3, Twitter Cancel ReplyWrite a Comment [...]
[...] ●AS3でTwitter発言を読み込む http://blog.alt-scape.com/archives/234 [...]
[...] cross-domain proxy FlashでTwitterの発言を取得してみる [...]
[...] // http://blog.alt-scape.com/archives/234 åèãµã¤ã [...]
[...] alt カテゴリー: 総合 パーマリンク ← ５代目志ん生 [...]
すみません。
サンプルを頂いていくつか試しているのですが
以下のリンク設定にした場合、以下のエラーが出ます
var xmlURL:String = "http://私のレンタルサーバー/crossdomain-proxy.php?url=http://twitter.com/statuses/friends_timeline/masason.xml?cache=" n;
↑たとえば孫社長の友達の発言情報
Twitterユーザー全員の発言情報はうまく表示しましたがそれ以外の個人的なリストだったりがうまく表示されません。そのようなつくりなのでしょうか？
TypeError: Error #1010: 条件は未定義であり、プロパティがありません。
at twitter_fla::MainTimeline/traceComplete()
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/onComplete()
よろしくお願いします
>skaino様
Could not authenticate you.というエラーコードが返ってきてますね。
認証に失敗していると言っていますので、public_timeline以外は何か認証が必要になったのかもしれません。
約2年前の記事ということもあってTwitter APIも仕様が変わっているので
そのまま使えないことはご考慮ください。
自分の方でも時間のあるときにちょっと調べてみます。
※直接関係ないかもしれませんが
2010年8月16日までにTwitter APIはBASIC認証からOAuth APIに移行するそうです。
http://blog.twitter.jp/2010/06/twitter-api-oauth.html
はじめまして。
私は全くの初心者ですがFlashでTwitterの発言を表示したくて、いろいろと調べていたところ、
こちらにたどり着きました。素人の私でも出来ました！有り難うございます。
ASやTweenerなどは勉強不足でよくわからないのですが、単純に白い背景に黒のテキストが
表示されるだけでモーションもしないもの（リロードはする）を作りたいと思っています。
これは、ソースのどの部分を変えたらよろしいでしょうか？
素人質問で大変申し訳ないのですがご教授いただけると助かります。
＞hide 様
返信が遅くなり申し訳ないです。
基本はcircleというSpriteのなかで
円を描いている部分を消すだけでいけます。
見ていただいた方が早いかもしれませんのでソースもアップしておきます。
http://blog.alt-scape.com/fla/twitter_sample2.zip
先述のhideと申します。
いろいろご教授いただき、有り難うございました。
とても勉強になりました。
素人はなかなか相手にしてもらえないことが多いですが
ご親切にしていただき感謝しております。
自分でもこれから少しづつ勉強してまいりたいと思います。
[...] alt alt-scape weblog こちらのブログの記事とソースを参考にさせていただきました。 [...]
はじめまして。最近Flashをはじめたばかりの本当の素人なのですが、Flashを使ってホームページを作成しているのですが、どうしてもTwitterを挿入したくて、迷っていましたらこちらにたどりつきました。hideさんに書かれたサンプルを見せていただいたのですが、自分のTwitterの発言のみを表示したい場合は具体的にどこを変更したらよいのでしょうか？htmlにツイータを埋め込んだようなシンプルな形にしたいと考えているのですが、素人質問で申し訳ないですが教えていただけたら幸いです。
はじめまして。Flashでtwitterを表示したくて検索したらこちらのサイトを見つけました。
altさんが作られたサンプルをダウンロードさていただきました。大変参考になりました、ありがとうございました。
質問なのですが、変数"xmlURL"の部分を"http://blog.alt-scape.com"で実行すると正常に動作するのですが、自分のサーバー？にするとエラーが出てしまいます。
初歩的さ質問で申し訳ありません。
>Shinさん
私もいろいろ触っていてできたのですが、
初めに書かれている"http://twitter.com/statuses/public_timeline.xml"の
"public_timeline.xml"を
”user_timeline/自分のユーザーネーム か IDナンバー.xml”に変更するとできましたよ。
説明が下手で申し訳ないです。
＞Shin 様
はじめまして。
当時のAPIと今とでは仕様が変わっていると思いますが
sugatoさんがpublic_timeline.xml部分を変えたらいけたということですので試してみてください。
＞sugato 様
http://blog.alt-scape.com/swf/crossdomain-proxy.phpは
私のサーバーにおいたProxy用のPHPファイルですので
このままのURLでご利用いただくか、変更したい場合は
下記のURLを参考にしてPHPファイルをご自身のサーバーにおいていただくしかないです。
http://yoppa.org/blog/366.html
宜しくお願い致します。
ありがとうございます。無事に解決できました。
初めまして。flashでtwitterを連動させたいと思い、
こちらの記事にたどりつきました。
よくtwitterを使う場合、ＡＰＩで1分間で６０回とか制限をきいたりするのですが、
こちらのサンプルでも、そういう制限があるのでしょうか？
初歩的な質問で申し訳ありません。
お手数でなければ教えて頂けますでしょうか？
＞rozic 様
はじめまして。
はいAPIの利用回数制限はあります。
ただし、サンプルソース内でとくに制限しているわけではなく、
Twitterサーバー側での制限になるので
利用回数を超えるとエラーが返ってきます。
はじめまして。
私もFlashの初心者ですが、Twitterを取り込んだグラフィックを作ってみたいと思い、ここに辿り着きました。
これなら私にもできそう！！と思って、【2009/9/15追記】で提供されてるソースをダウンロードさせて頂いたのですが、残念ながら、それは、Flashに書き出す際にエラーが出て生成できませんでした。他の方のコメントへのaltの回答にもあったようにTwitterのAPI仕様が変わったからかなと諦めていたのですが、その後のコメントを見ていて、hideさんへの回答（8月 19th, 2010）で円を使った表示ではないソースを提供されていたので、そちらもダウンロードしてみたところ、問題なくFlashに書き出すことができました。そこで、Twitterの仕様の変化に対応済みになっているのかと思い、２つのソースを比べてみたのですが、円の表示が通常のリスト表示に変わっている部分以外に違いは無いように見えました（素人目に）。ということは、最初のソースは円の表示の部分でエラーが出ているんですかね？・・・なんだかしつこいようで申し訳ないですが、私はどちらかというと円表示のほうのソースを参考にさせて頂きたかったので、、、。数年前に作成されたプログラムのことで本当に申し訳ないのですが、お時間がある時にご回答頂けると助かります。
すみません、先程書き込みした後しばらくして、【2009/9/15追記】提供のソースには、caurinaというフォルダが無いことに気づき、8月 19th, 2010提供のものからコピーして入れてみると、ムービーの書き出しができるようになりました！！
自問自答になってしまって、スミマセン、、、。
alt様
以前質問させていただいた者ですが
ご返答ありがとうございました。
大変参考になりました！！！
[...] onで持ってかえってきて、xml形式に変換してaction scriptに送る、というphpを作成しました。 こちらでasをお借りしました。 http://www.miyasaka.info/flashtest/twitter.html カテゴリー: blog パー [...]
はじめまして。
私もFlashの初心者です。
TwitterをFlashで読み込めないかと、探していた時こちらに辿りつきました。
とてもわかりやすく、助かりました。
一つ質問させて頂きたいのですが、サンプルのようなcircleをグラフィックで表示するのではなく、読み込んだ画像でcircleを表示させたい場合はどうすればいいでしょうか？
初歩的な質問で大変申し訳ございませんが、ご教示お願い致します。
＞Rina様
はじめまして。
サンプルflaの1フレーム目で処理しているTwitter APIの読み込み前に
Loadクラスを使用して画像の読み込みを事前に行っておくことで表示できると思います。
仮に読み込んだ画像がvar img:Sprite = new Sprite()にaddChildされていると仮定して、
サンプルの円作成のタイミングでcontainer.addChild(circle)しているところを
container.addChild(img)にしてやればよいかと思います。
説明不足でわかりにくかったらすみません。
alt様
ありがとうございます！
とても助かります！
早速試してみたのですが、私の書き方が悪いのか、
画像は端に表示されるのですが、読み込みされるつぶやきには背景が表示されません。
//画像読み込み
var spr:Loader = new Loader();
var img:URLRequest = new URLRequest("babble.png");
spr.load(img);
addChild(spr);
//発言
var spr:Sprite = new Sprite();
spr.name="spr" t;
spr.x=Math.floor(Math.random()*stage.stageWidth);
spr.y=Math.floor(Math.random()*stage.stageHeight-50);
container.addChild(spr);
このように書いているのですが、どうにも上手く行きません。
何度も申し訳ないですが、アドバイス頂けますでしょうか。
宜しくお願い致します。
Rina様
スクリプトを拝見したところ、
画像はLoaderインスタンスをそのままルートにaddChildしているだけなので
左上に配置されてしまいます。
これを一旦、ローディングが終了したタイミングでBitmap化し、
円作成時に毎回画像コピーしたものを
sprのなかにaddChildしてあげるかたちがよいかと思います。
参考までにサンプルソース載せておきます。
//画像読み込み
var loader:Loader = new Loader();
var img:URLRequest = new URLRequest("babble.png");
loader.load(img);
var info:LoaderInfo = loader.contentLoaderInfo;
info.addEventListener(Event.INIT, function(e:Event):void {
var bmp:Bitmap = new Bitmap();
bmp = Bitmap(loader.content);
});
//発言
var spr:Sprite = new Sprite();
spr.name="spr" t;
spr.x=Math.floor(Math.random()*stage.stageWidth);
spr.y=Math.floor(Math.random()*stage.stageHeight-50);
var bmpCopy:Bitmap = new Bitmap(bmp.bitmapData.clone());
spr.addChild(bmpCopy);
container.addChild(spr);
alt様
何度もすみません。
サンプルソースまでのせて頂き、ありがとうございます。
無事解決しました。
ご丁寧に対応してくださり、ありがとうございました！
[...] APIについては、FlashでTwitterの発言を取得してみる を参考にさせていただきました。 [...]
[...] REST API：ユーザー関連｜Twitter関連｜Web関連特集｜PHP & JavaScript Room http://blog.alt-scape.com/archives/234 Twitterユーザー全員の発言情報を5秒おきに最新10件表示 AKPC_IDS += "3605,"; [...]
[...] FlashでTwitterの発言を取得してみる [...]