{GlobalGiving API} GlobalGiving API and ajax

76 views
Skip to first unread message

rayd

unread,
May 6, 2010, 9:31:30 PM5/6/10
to GlobalGiving API
I'm trying to use XMLHttpRequests to grab data the GlobalGiving API
but I can't seem to get it working.
Here's what I'm doing just for a test, but I'm not getting anything
back. In fact, when I'm using the Chrome dev tools, I don't even see a
response to my request.

jQuery.ajax({url:"https://api.globalgiving.org/api/public/
projectservice/all/projects?
api_key=e10c5e8e-730f-41c0-9b07-0983c94160a4",
dataType: 'xml', cache: false, type: 'GET'});

Can anyone shed some light on this?

Thanks a lot!

- Ray

--
You received this message because you are subscribed to the Google Groups "GlobalGiving API" group.
To post to this group, send email to globalgi...@googlegroups.com.
To unsubscribe from this group, send email to globalgiving-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/globalgiving-api?hl=en.

Mark Silverberg

unread,
May 6, 2010, 11:16:28 PM5/6/10
to globalgi...@googlegroups.com
Hi there,

Doing a simple curl (from the command line of any unix or mac) shows that the URL you are trying to HTTP GET is valid - so the problem definitely lies in your jQuery fun which I'm personally not well-mannered in. Now that we know it's a jQuery issue, perhaps you should ask for general help from that community..

ma...@marksilver.net

Kevin Conroy

unread,
May 6, 2010, 11:42:55 PM5/6/10
to globalgi...@googlegroups.com
Thanks Mark!

Yes, it looks like a JQuery problem. I'd recommend checking out the documentation for the ajax call:


You need to set up a success function for JQuery to call when it returns with the result. You may also have better success with JQuery.get. There are a number of wonderful tutorials online. Here's one that a quick Google search found:


Hope this helps. If not, please write back and post more of your code so we can try to help.

Cheers,
Kevin

Kevin Conroy
E-mail: kevin...@gmail.com

rayd

unread,
May 8, 2010, 2:55:21 PM5/8/10
to GlobalGiving API
I'm not sure that it's a jQuery problem -- using Firebug, I can see
that a get request is being sent out with the following headers:

Host: api.globalgiving.org
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:
1.9.1.9) Gecko/20100315 Firefox/3.5.9
Accept: application/xml, text/xml, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer: http://damp.cs.dartmouth.edu/csfam/donations.html
Origin: http://damp.cs.dartmouth.edu

and I receive a response with these headers:

Date: Sat, 08 May 2010 18:24:31 GMT
Server: Apache-Coyote/1.1
Cache-Control: max-age=43200
Content-Type: application/xml;charset=UTF-8
P3P: CP="CAO PSA OUR"
Vary: Accept-Encoding
Content-Encoding: gzip
Keep-Alive: timeout=15
Connection: Keep-Alive
Transfer-Encoding: chunked
Set-Cookie: Coyote-2-44b1e587=a010065:0; path=/

but there is no actual data in the response.
I added a success and error response functions, and they indicate that
the data in the response is null.

Thanks a lot for your help!

- Ray

On May 6, 11:42 pm, Kevin Conroy <kevincon...@gmail.com> wrote:
> Thanks Mark!
>
> Yes, it looks like a JQuery problem. I'd recommend checking out the
> documentation for the ajax call:
>
> http://api.jquery.com/jQuery.ajax/
>
> You need to set up a success function for JQuery to call when it returns
> with the result. You may also have better success with JQuery.get. There are
> a number of wonderful tutorials online. Here's one that a quick Google
> search found:
>
> http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax...
>
> Hope this helps. If not, please write back and post more of your code so we
> can try to help.
>
> Cheers,
> Kevin
>
> Kevin Conroy
> E-mail: kevincon...@gmail.com
>
> On Thu, May 6, 2010 at 11:16 PM, Mark Silverberg <m...@marksilver.net>wrote:
>
>
>
> > Hi there,
>
> > Doing a simple curl (from the command line of any unix or mac) shows that
> > the URL you are trying to HTTP GET is valid - so the problem definitely lies
> > in your jQuery fun which I'm personally not well-mannered in. Now that we
> > know it's a jQuery issue, perhaps you should ask for general help from that
> > community..
>
> > m...@marksilver.net
>
> > On May 6, 2010, at 9:31 PM, rayd wrote:
>
> > > I'm trying to use XMLHttpRequests to grab data the GlobalGiving API
> > > but I can't seem to get it working.
> > > Here's what I'm doing just for a test, but I'm not getting anything
> > > back. In fact, when I'm using the Chrome dev tools, I don't even see a
> > > response to my request.
>
> > > jQuery.ajax({url:"https://api.globalgiving.org/api/public/
> > > projectservice/all/projects?
> > > api_key=e10c5e8e-730f-41c0-9b07-0983c94160a4",
> > > dataType: 'xml', cache: false, type: 'GET'});
>
> > > Can anyone shed some light on this?
>
> > > Thanks a lot!
>
> > > - Ray
>
> > > --
> > > You received this message because you are subscribed to the Google Groups
> > "GlobalGiving API" group.
> > > To post to this group, send email to globalgi...@googlegroups.com.
> > > To unsubscribe from this group, send email to
> > globalgiving-a...@googlegroups.com<globalgiving-api%2Bunsu...@googlegroups.com>
> > .
> > > For more options, visit this group at
> >http://groups.google.com/group/globalgiving-api?hl=en.
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "GlobalGiving API" group.
> > To post to this group, send email to globalgi...@googlegroups.com.
> > To unsubscribe from this group, send email to
> > globalgiving-a...@googlegroups.com<globalgiving-api%2Bunsu...@googlegroups.com>
> > .
> > For more options, visit this group at
> >http://groups.google.com/group/globalgiving-api?hl=en.
>
> --
> You received this message because you are subscribed to the Google Groups "GlobalGiving API" group.
> To post to this group, send email to globalgi...@googlegroups.com.
> To unsubscribe from this group, send email to globalgiving-a...@googlegroups.com.
> For more options, visit this group athttp://groups.google.com/group/globalgiving-api?hl=en.

Kevin Conroy

unread,
May 8, 2010, 3:09:37 PM5/8/10
to GlobalGiving API
Hi Ray,
If you don't mind, can you post up the entire HTML (and any JS) file
that you're calling? This will make it easier for me to help you debug
the problem.

Thanks,
Kevin
> > > globalgiving-a...@googlegroups.com<globalgiving-api%2Bunsubscrib e...@googlegroups.com>
> > > .
> > > > For more options, visit this group at
> > >http://groups.google.com/group/globalgiving-api?hl=en.
>
> > > --
> > > You received this message because you are subscribed to the Google Groups
> > > "GlobalGiving API" group.
> > > To post to this group, send email to globalgi...@googlegroups.com.
> > > To unsubscribe from this group, send email to
> > > globalgiving-a...@googlegroups.com<globalgiving-api%2Bunsubscrib e...@googlegroups.com>

rayd

unread,
May 8, 2010, 4:47:46 PM5/8/10
to GlobalGiving API
The page I'm testing on can be viewed here:

http://damp.cs.dartmouth.edu/csfam/donations.html

Here's the html/js:

<html>
<body>
<script type='text/javascript' src='lib/jquery-1.4.2.js'></script>
<script>
jQuery.ajax({
url:"https://api.globalgiving.org/api/public/projectservice/all/
projects",
data: {api_key: 'e10c5e8e-730f-41c0-9b07-0983c94160a4'},
dataType: 'xml', type: 'GET',
contentType: null,
success: function(res){
window.alert(res);
},
error: function(xhr,stat,err){
window.alert('error: ' + stat + ' Exception: ' + err);
},
beforeSend: function(xhr){
// xhr.setRequestHeader('Cache-Control','max-age=0');
}});
</script>
</body>
</html>

Thanks

Steve R.

unread,
May 9, 2010, 11:24:30 AM5/9/10
to GlobalGiving API
Ray,

The gist of the problem of using Javascript to access our API is cross-
domain scripting, which most (if not all) browsers prevent, due to
security concerns.

That is the reason you are getting an error result and no data. The
browser security is preventing it.

Here is something I tried, after reading the Json documentation:

I changed the dataType to 'jsonp' in the .ajax(....) call. Reading
about this here: http://api.jquery.com/jQuery.ajax/ and here:
http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/ seems
like a proposed solution to the cross domain issue.

However, GlobalGiving has not implemented to handle the callback=?
parameter that gets prepended to the query String.

When I tried this, however, I do get data back in the response from a
call. For some reason though, its not passing application/json as the
Content-Type, or Accept Headers, as I would want to do. It seems that
in the Request Header, the Accept header is "*/*", the GlobalGiving
API defaults to xml if this header is not specified as application/
json.

The response is xml however, and readable, but a Javascript error
occurs on the data, as it seems its trying to parse as json, or its
trying to parse the response as a "function" call, since the proposed
spec for jsonp would require GlobalGiving to wrap the json response in
a "function call", like: jsonp123123123({the json response goes
here})

But I see two current problems accessing the GG API this way:

1) JQuery is not setting the correct headers to tell the GG API to
process and format the response in json
2) GG API does not recognize the callback parameter to know to wrap
the json response in a function call.

I hope this helps, and if you can get this working (ie, sending to GG
API with the correct Accept and Content-Type Headers), then I will see
what can be done to push GG to make a change to their API to wrap the
response when a callback parameter is found.

Steve

Steve R.

unread,
May 9, 2010, 12:43:19 PM5/9/10
to GlobalGiving API
Regarding the Headers required to get a json response....

Must be name="Accept" (or "accept", case insensitive),
value="application/json", or simply "json".

Any other value, or if the header is missing, will result in xml
formatted response.

I cannot figure out why when setting the datatype: 'jsonp', it seems
to crush any other uses of "contentType:", or event in the beforeSend
call where the explicit header is set (xhr.setRequestHeadaer('Accept',
'applicaiton/json')).

Strange behavior for sure, but the cross domain ajax remains a problem
without a standard solution.

Steve

Steve R.

unread,
May 9, 2010, 4:36:16 PM5/9/10
to GlobalGiving API
I posted some questions on the JSON message board, and subsequently
filed a bug report:

http://api.jquery.com/jQuery.getJSON/#comment-49194499

Steve

rayd

unread,
May 11, 2010, 11:50:09 PM5/11/10
to GlobalGiving API
Steve, thank you very much! That totally makes sense -- I should have
thought of the security issues... I'll give this jsonp stuff a read
and a try and then I'll report back with the results.

thanks a ton!

- Ray

rayd

unread,
May 12, 2010, 8:16:50 PM5/12/10
to GlobalGiving API
Ok, so what I've found is that when youre using the jsonp method, it's
not even using XHRs. it's just injecting a script tag into the page as
follows:

<script src="https://api.globalgiving.org/api/public/projectservice/
all/projects?
callback=jsonp1273709554596&amp;api_key=e10c5e8e-730f-41c0-9b07-0983c94160a4"></
script>

so it's able to circumvent the cross-domain requests by just
downloading the "script", which is actually xml/json.
since its not using XHRs, none of the XHR callbacks will work using
this method. so i dont think there is any way to set the headers to
specify that we want JSON as opposed to XML. what we need is an
addition to the globalgiving api to include a query string parameter
to specify what format we would like...
Reply all
Reply to author
Forward
0 new messages