jQuery .ajax call returning error when accessing Java Spring service via domain name based URL

Question

My application's HTML5, jQuery Mobile frontend talks to Java server (Spring, Hibernate, MySQL). The application works fine on my notebook as well as in QA environment. On QA, I'm accessing the application using the server's IP address. When I host the application in Live environment (the same server as QA but a different web app in Tomcat) and try to access it using URL with the domain name, $.ajax calls in the application return error.

One of the calls is as follows:

$.ajax({
   type : "GET",
   url : "http://www.smartcloudlearning.mobi:9080/SmartCloudLearningMobi/rest/resource/getResourceTypes",
   cache : false,
   async : false,
   dataType : 'json',
   success : function(rTypes) {
       Alert("success!");
   },
   error : function(XMLHttpRequest, textStatus, errorThrown) {
      alert("An error has occurred making the request: " + errorThrown);
   }
});

I get the following error in Firefox:

An error has occurred making the request: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE)"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: http://www.smartcloudlearning.mobi/js/jquery-1.7.1.min.js :: <TOP_LEVEL> :: line 4"  data: no]

I get the following error in Chrome:

An error has occurred making the request: Error: NETWORK_ERR: XMLHttpRequest: Exception 101

In the server log, I see that the requested Spring service was successfully invoked but it looks like the client doesn't receive the data!

If I hit the URL

http://www.smartcloudlearning.mobi:9080/SmartCloudLearningMobi/rest/resource/getResourceTypes

directly in the browser, I get expected results! I sense that this is somehow due to how I forward server request from Apache to Tomcat.

The following are the lines in Apache / httpd server's httpd.conf file:

ProxyPass /SmartCloudLearningMobi http://www.smartcloudlearning.mobi:9080/SmartCloudLearningMobi
ProxyPassReverse /SmartCloudLearningMobi http://www.smartcloudlearning.mobi:9080/SmartCloudLearningMobi

Can anyone tell me what's amiss here? Much appreciated!

I managed to solve the problem:

The browser was giving the error on .ajax call because I had port number in my URL. The port number got carried over when I created 'live' URL from my QA URL. When I removed the port number from the .ajax call's URL, the call started returning success!

Jason Foglia, your statement "... and also the port..." nudged me to explore that angle... thanks a lot!

you're missing the opening quote in your URL of the ajax call — SSH This, Apr 16 '12 at 21:21
Sorry... that was my typo when I drafted this post from the code. The actual code does have opening quote. — Dilip Shah, Apr 16 '12 at 21:32

score 4 · Answer 1 · edited May 23 '17 at 12:22

4

You're probably getting an error because of a security concept called "same origin policy" which doesn't allow you to call a service from a different domain. Or at least, disallow you from calling a method in that service.

Same discussion is found here - AJAX Cross Domain

You can however implement a cross-domain using JSONP - Wikipedia on JSONP

The solution is to change the datatype to JSONP:

$.ajax({
   url:"http://www.smartcloudlearning.mobi:9080/SmartCloudLearningMobi...",
   dataType: 'jsonp',
   ...
});

edited May 23 '17 at 12:22

Community

1
1

answered Apr 16 '12 at 21:45

Dennis Rongo

4,451
1
22
23

Yep, or if possible, use a relative URL, it'll be less painful ;) – SSH This Apr 16 '12 at 21:58

score 2 · Answer 2 · answered Apr 16 '12 at 21:36

Try using an relative url: If that doesn't work is the domain name the same as the url and also the port. Browsers don't allow cross domains.

$.ajax({
   type : "GET",
   url : "/SmartCloudLearningMobi/rest/resource/getResourceTypes",
   cache : false,
   async : false,
   contentType : "application/json"
   dataType : 'json',
   success : function(rTypes) {
       Alert("success!);
   },
   error : function(XMLHttpRequest, textStatus, errorThrown) {
      alert("An error has occurred making the request: " + errorThrown);
   }
});

I've used a work around for a cross domain issue before. I basically setup a proxy on my server. — Jason Foglia, Apr 16 '12 at 22:11

score 0 · Answer 3 · answered Apr 17 '12 at 14:22

The browser was giving the error on .ajax call because I had port number in my URL. The port number got carried over when I created 'live' URL from my QA URL. When I removed the port number from the .ajax call's URL, the call started returning success!

Jason Foglia, your statement "... and also the port..." nudged me to explore that angle... thanks a lot!

jQuery .ajax call returning error when accessing Java Spring service via domain name based URL

3 Answers3