Possible to get Asana tasks through JSON-P and Asana Connect?

Question

Is it possible to connect to ASANA without a backend?

We have a secure folder on a webserver where we'd like to retrieve a task list of a project using only Javascript. Is that possible?

I saw some news from Asana that they support JSON-P through Asana Connect, but it's a bit unclear on how you could set this up from the documentation. Is there any examples available that I haven't found? Or have anyone succesfully set this up earlier?

Answer 1

The preferred way to do this is using CORS (added November 2013) - see this gist for an example of how you can use it. If you're unfamiliar with CORS, it stands for Cross-Origin Resource Sharing, and allows you to make cross-domain requests, given that the headers of the client and server match appropriately.

Answer 2

Incase anyone is already using Jquery (like I am) you can use the following code to do the same as the example from @agnoster.

$.ajax({
       url : 'https://app.asana.com/api/1.0/users/me',
       dataType : 'json',
       type: 'GET',
       beforeSend : function(xhr) {
           xhr.setRequestHeader('Authorization', 'Basic ' + btoa(api_key + ":"));
       }
    }).done(function(response) {
        console.log(response.data);
    });

And if you need to POST/PUT you can use jQuery like this:

$.ajax({
    url : https://app.asana.com/api/1.0/tasks/taskid',
    dataType : 'json',
    type: 'PUT',
    data: { "completed": true }, 
    beforeSend : function(xhr) {
        xhr.setRequestHeader('Authorization', 'Basic ' + btoa(api_key + ":"));
    }
});

PS! you'll not be able to get this working for IE9 as it does not support sending headers (so the xhr.setRequestHeader() won't work)