tags:

views:

128

answers:

2

Hi there

I'm trying to access a 3rd party api over http using jquery .ajax (or .get, .post etc). The api resides on my machine at

http://localhost:7777/server/<method>?<args>

The server has a stack of methods to query its OLAP server such as login (which returns a login key to use with other methods), databases (that lists the databases on the server), cubes, dimensions etc etc

for example

To login to the server

http://localhost:7777/server/login?user=admin&password=21232f297a57a5a743894a0e4a801fc3

If I enter this into a browser address bar, I get the correct data back.

However, I want to make a small web page to test the calls and figured I should be able to use jQuery to create the Gets and return the data that went to the browser.

Heres my code

<html>
<head>
    <title>Palo Test Report</title>
    <script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
        <script type="text/javascript" language="javascript">            
        function calculate(){
            $.ajax({
                type:"GET",
                url:"http://localhost:7777/server/login?user=admin&amp;password=21232f297a57a5a743894a0e4a801fc3&amp;callback=?",
                success: function(data,textStatus){
                    alert(data + ":" + textStatus);
                }
                ,
                error: function(request,errorStatus,errorThrown){
                    alert("Error:" + errorThrown);
                }
            });
        }
    </script>
</head>
  <body>
      <div>Sample Palo Report #1</div>
      <input type="button" value="Calculate" onclick="calculate();" />
  </body>
</html>

The method goes of to the server and hits the success callback. However, the data paramter is an empty string.

I read a few posts regarding problems with cross domain access via ajax and it looks like thats what might be happening as the service is running off a different port, though I'm a bit surprised with the "success" flag. Another odd thing is that if I create a new virtual dir in IIS and drop the file in there, I hit the error callback with an empty errorThrown parameter.

The service/api is returning simple strings not json so getJSON doesn't work.

Is what I am trying possible with jQuery?

I do have a workaround but its pretty ugly!

Thanks in advance

G

+1  A: 

Ajax calls are limited on the same domain. You need jsonP to query an 3rd party domain. Check ajax() method jsonP option.

Elzo Valugi
+1  A: 

My guess is your test webpage is located on http://localhost:7777 because it wouldn't work otherwise.

$.ajax works as expected but since you didn't provide the option dataType: "jsonp":

  • it assumes the data retrieved is XML or HTML (an "intelligent" guess according to the doc, but we all know what intelligence really means when it comes to algorithms)
  • it doesn't bother handling the callback=? piece of the url (if you trace network traffic with something like firebug, you can easily control that the callback=? part of the url stays as is)

Now, the server response is definitely not XML nor HTML, but the request succeeded. So you end up with your success callback being called with an empty data parameter (though I would have expected a basic HTML document with the response text in its body).

Just add dataType: "jsonp" in your options and it should work as expected.

Julian Aubourg