Pass online 'url' into ajax in jquery

Question

I have a ajax code that is

<script>
function myFunction() {
       $("#dvContent").append("<ul></ul>");
        $.ajax({
            type: "GET",
            url: "test.xml",
            dataType: "xml",
            success: function(xml){
                $(xml).find('record').each(function(){
                var sTitle = $(this).find('datafield[tag="245"]').find('subfield[code="a"]').text();
                 var sAuthor = $(this).find('datafield[tag="100"]').find('subfield[code="a"]').text();
                  var sIsbn = $(this).find('datafield[tag="020"]').find('subfield[code="a"]').text();


                $.getJSON('https://www.googleapis.com/books/v1/volumes?q=isbn:0545010225', function(data) {
        
                var text = `${data.items[0].volumeInfo.imageLinks.thumbnail}`


                var x = document.createElement("IMG");
                x.setAttribute("src", text);
                 document.body.appendChild(x);



                

                  
        
        $(".mypanel").html(text);
    });


                $("<li></li>").html(sTitle).appendTo("#dvContent ul");
                $("<li></li>").html(sAuthor).appendTo("#dvContent ul");
                $("<li></li>").html(sIsbn).appendTo("#dvContent ul");
                    });
            },
            error: function() {
            alert("An error occurred while processing XML file.");
            }
        });
}
</script>

Now i want to to fetch the values from a link rather than from a local file , in my case test.xml .

i have tried putting

 url: "http://lx2.loc.gov:210/lcdb?operation=searchRetrieve&recordSchema=marcxml&version=1.1&maximumRecords=10&query=bath.isbn%3D0545010225"

But then my code stops working . Any help regarding this will be highly appreciated.

EDIT 1: I googled around a bit and i've realized it's a cross domain issue.

score 0 · Accepted Answer · answered Oct 13 '17 at 12:20

0

You are probably suffering a CORS issue. Normally you can only hit a domain from a script being executed in the same one.

You can learn about it here: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

Of course, you can change the server configuration to allow access to more domains (if you are controlling it).

Take a look at the docs it's interesting :)

answered Oct 13 '17 at 12:20

Javier Cobos

1,172
10
22

ya . i've read it all , i was thinking off creating a script tag and calling the URL inside , and try to connect it with my AJAX call. – Harjeev Singh Oct 13 '17 at 12:44
This wont help you at all, what you can actually do is to do this in server side with an actual request. If you build a small nodejs / php application that makes the request, where you can control the CORS, then your js hits your server and the server hits the endpoint. – Javier Cobos Oct 13 '17 at 12:47
Something like , when i insert my search string , it goes to the backend(PHP) , where i'll use file_get_contents() to extract the contents of the URL and then pass it in the front end inside Ajax part. – Harjeev Singh Oct 13 '17 at 12:51
Exactly :) Take a look to this post:https://stackoverflow.com/questions/29837162/bypassing-cors-with-php-and-javascript-ajax – Javier Cobos Oct 13 '17 at 12:52
If this helped, could you please set my answer as valid? Thanks :) – Javier Cobos Oct 13 '17 at 12:53
alright , thank you very much , i'll check the link out – Harjeev Singh Oct 13 '17 at 12:55
my reputation is not upto for that. – Harjeev Singh Oct 13 '17 at 13:03

Pass online 'url' into ajax in jquery

1 Answers1