How do I send an AJAX request on a different port with jQuery?

Question

I need to send an AJAX request to, for example, port 8080 where a daemon is running there.

Solution 1

You cannot POST information cross domain, subdomain, or port number. You can however use JSONP if you have access to both the daemon and the requesting site. If data needs to be returned, then the daemon needs to support a callback query parameter and return it properly formatted.

Pass the information to the daemon:

$.getJSON('http://domain.com:8080/url/here?callback=?', {
  key: 'value',
  otherKey: 'otherValue'
}, function(data){
     // Handles the callback when the data returns
});

Now just make sure your daemon handles the callback parameter. For instance, if callback=mycallback the return from the daemon (the only thing written to the page) should look like this:

For an key/value pairs:

mycallback( {'returnkey':'returnvalue', 'other':'data' });

For an array:

mycallback( [1,2,3] );

If you do not have a JSONP or similar mechanism in place, you cannot communicate cross domain using jQuery.

Solution 2

This breaks the Same origin policy. You cannot use a different port, even when using the same domain.

You can use JSONP as Doug suggested.

Or else, as another possible workaround, you could set up a very simple reverse proxy (using mod_proxy if you are on Apache). This would allow you to use relative paths in your AJAX request, while the HTTP server would be acting as a proxy to any "remote" location.

The fundamental configuration directive to set up a reverse proxy in mod_proxy is the ProxyPass. You would typically use it as follows:

ProxyPass     /ajax/     http://www.localhost:8080/

In this case, you would request /ajax/test.xml with jQuery, but in fact the server would serve this by acting as a proxy to http://www.localhost:8080/test.xml internally.

If you are using IIS, you may want to use the Managed Fusion URL Rewriter and Reverse Proxy to set up a reverse proxy.

Solution 3

This counts as a different origin, even though you have it on the same box, just different port.

If you are targetting mostly new browsers like FireFox 3.5 and up, you can try to add Access-Control headers to your application in another port and allow to call from your default app pool. Information about access control headers can be found here: https://developer.mozilla.org/en/HTTP_access_control

IE also implements it (again, in using a different ACTIVEX control, why so?): http://blogs.msdn.com/ie/archive/2009/01/14/completing-access-control-support-for-xdomainrequest.aspx and http://msdn.microsoft.com/en-us/library/cc288060(VS.85).aspx

Comments

[user198729]

Is there a general way to replace domain.com?This way it can only work in production,because I use localhost in developing environment.

[Doug Neiner]

You should be able to use 'http://' + window.location.hostname + ':8080/url' to build the URL that will work both locally and online.

[Doug Neiner]

+1 For a fantastic answer. I answered the wrote "blah blah blah" canned response, and you provided a very viable solution. Thanks Daniel!

[user198729]

Oh,proxy will cause extra processing on server side.So I'll choose jsonP

[screenm0nkey]

I'd been scratching around for day trying to work out why I couldn't post data across ports before I found this. Thanks man.

[tObi]

hey, what about CORS?