I’ve been meaning to spend some time playing with twitter’s API. So, I decided to build a really simple js app on top of the search api.
Essentially, I want to show a list of statuses from a search, say ‘baroquebobcat’ and do it in the least amount of effort possible.
There are more complicated ways to do it, but I wanted to see how easy it was.
First, I thought I would do what the API docs suggest and poke around with curl.
Since all I want is to do a search, like you would using a browser, why not try that, only with json, for extra awesomeness.
$ curl 'http://search.twitter.com/search.json?q=baroquebobcat'
Running that gets me a long string of json:
{"results":[{"text":"Talkin' 'bout sandwiches", ...
Breaking that down with structurally looks like
{
"results": [
{ "text":"Talkin' 'bout sandwiches",
"to_user_id":null,
"from_user":"baroquebobcat",
"id":1307603293,
"from_user_id":125785,
"iso_language_code":"en",
"source":"web<\/a>",
"profile_image_url":"http:\/\/s3.amazonaws.com\/twitter_production\/profile_images\/79555083\/face02_normal.jpg",
"created_at":"Tue, 10 Mar 2009 22:04:12 +0000"
},
...
],
"since_id":0,
"max_id":1307851898,
"refresh_url":"?since_id=1307851898&q=baroquebobcat",
"results_per_page":15,
"next_page":"?page=2&max_id=1307851898&q=baroquebobcat",
"completed_in":0.033281,
"page":1,
"query":"baroquebobcat"
}
Results contains the statuses that match the search, the other 1st level attributes are metadata about the search.
For my silly simple js app, all I really need is a subset of this vertiable bevy of infos.
I am not even going to bother with the search metadata and am going to throw away most of the statuses data too.
For now, I only care about the text, and the user who tweeted it.
{
"results": [
{ "text":"Talkin' 'bout sandwiches",
"from_user":"baroquebobcat"
},
...
]
}
So, I have this list and a url to get stuff. How does that go into the javascript?
we need a callback. Because of all that cross site scripting etc stuff, you can’t do ajax requests for data like this
(well you can as long as you proxy it through your host somehow like this guy ).
So, the way to get all this stuff so it can be executable is to add a callback parameter to the request. It wraps the json with a function call so you can use it in a script tag.
$ curl 'http://search.twitter.com/search.json?q=baroquebobcat&callback=awesome'
awesome({"results":[{"text":"Talkin' 'bout sandwiches", ...})
so in html file can do
and awesome will be executed with the response from the search.
cut to the chase
So, we need a callback.
because we lack imagination, lets call it twitter_callback.
Super Silly Twitter App
Pretty cool, huh?
What that does is define a call back that just writes each status in the search with the user’s name: their tweet on each line.
Actually, that is a bit boring.
All we have is the list, and it’s not very portable but it demonstrates how it works.
You could make it more robust by using a javascript function to insert the script tag, thereby allowing you to dynamically set the query.
There are problems with using js to do all the work here. It can be slower and it also can be a security risk–if you don’t trust twitter.
Laters.
