Question

With the follow code, the latest tweet is only occasionally showing in Chrome but always in Firefox. Typically only shows in Chrome with /? on the url but vanishes when I refresh.

jQuery(document).ready( function(){
console.log("getting twitter data..");
jQuery.getJSON("http://twitter.com/statuses/user_timeline/*hidden*.json?callback=?", function(data) {
    console.log("got it..", data);
        jQuery("#tweet").html(data[0].text);
        jQuery("#ttime").html(data[0].created_at);
} );
});

Answer 1

You are trying to get the direct JSON from the twitter API. This is not possible due the same origin policy. You are only allowed to get JSON from your own domain.

A workaround exists and it’s called JSONP (JSON with padding) and that’s what twitter is using. You need to append the name of a function to the callback parameter in the URL. This function then gets executed when the twitter API loads.

For example you could do it like this:

JavaScript

function render(data) {
  // data is the object that contains your twitter data. It's an usual JavaScript object.
}

HTML

<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/username?
callback=render"></script>

Make sure that render is already loaded when the twitter API loads.