Ajax with JQuery: 200 ok, but not "success"

Question

I'm trying to use AJAX to send a query to Google Books and display the results on my website. I'm using JQuery to send the request and handling the response, like so:

var query = [formatted input from a form];
var URL = "http://books.google.com/books/feeds/volumes?q="+query+"&start-index=1&max-results=5";

$.ajax({
    type: "GET",
    url: URL,
    dataType: "xml",
    success: function(data, status){
        alert(status);
    }
});

Currently, I just have the script alerting "success" if a response is received. If I use my script to send that query to a local page for testing, this works just fine. But when I set the URL to the Google one listed above, as instructed on the Developer API page, I never see the alert. According to Firebug, I am receiving a response and a status of 200 ok as I should, but it's not getting to that "success" path. Does anyone know why?

Edit: I should add that if I follow the URL directly, to http://books.google.com etc. with some random q, it displays the feed XML with no problems, so the query is not the issue.

You can't make cross-domain requests using XMLHttpRequest under the standard browser security settings. I don't see how you're even getting 200 OK, this snippet fails for me with a security error. — Jason LeBrun, Jan 30 '11 at 02:49
add an error handler? I added `error: function(data, status){ alert(status); }`, which was called for me when I tested it in Firebug on this page. — Michael Robinson, Jan 30 '11 at 02:50
I'm also facing same problem brother! Did you find in server side code? — Mahender Reddy Yasa, Jul 19 '15 at 06:27

Jason LeBrun · Accepted Answer · 2013-08-19T21:09:24.097

14

You can't make cross-domain requests using XMLHttpRequest under the standard browser security settings. One possible solution is to write a local proxy function (assuming you can create server-side code) that forwards the query to the external site, and then returns the response.

Edit: It looks like Google provides a JavaScript API as well. I would assume that they've crafted in such a way to avoid the cross-domain XHR issue.

http://code.google.com/apis/books/docs/js/devguide.html#execute

Edit: The JavaScript API for books was deprecated. While it's no longer practically useful, you can see the original referenced documentation text via the Wayback Machine archive: http://web.archive.org/web/20120414070427/http://code.google.com/apis/books/docs/js/devguide.html#execute

edited Aug 19 '13 at 21:09

answered Jan 30 '11 at 02:51

Jason LeBrun

13,037
3
46
42

Thank you for the quick replies! I set up another PHP page to interact directly with Google Books and it's working fine now. – tkm256 Jan 30 '11 at 03:30
Looks like you got some link rot there.. 404. – ORION Aug 19 '13 at 17:03

score 3 · Answer 2 · edited Jun 20 '20 at 09:12

It's a cross-domain problem with ajax calls because browsers have a security model based on a domain policy.

if you don't wan to include the whole Google Books API, you can also use Google Ajax API with jsonp for cross-domain ajax calls.

Docs here:

http://code.google.com/apis/books/docs/js/jsondevguide.html#basic_query

jQuery example

var query = 'jquery';
var URL = 'https://ajax.googleapis.com/ajax/services/search/books?v=1.0&q=' + query;

$.ajax({
    type: 'GET',
    url: URL,
    dataType: 'jsonp',
    success: function( data, status ){
        alert( data.responseData.results.length + ' results found!' );
    },
    error: function() {
        alert( 'Something goes wrong!' );
    }
});

Ciao!

Ajax with JQuery: 200 ok, but not "success"

2 Answers2

Docs here:

jQuery example

Linked