milky_jay milky_jay - 3 months ago 15x
Node.js Question

Get data from third party Node.js server hosted on Vagrant VM using jQuery - JSONP

I've got a Node.js server listening on localhost:3000 working as a black box that outputs UI that I want to load into a local website.

The consuming service written in jQuery is:

url: ':3000/',
method: "POST",
success: function(data) {
error: function(jqXHR, textStatus, errorThrown) {
alert('error ' + textStatus + " " + errorThrown);

Instead of visiting the page directly it loads content and appends it to

The issue is that the code does not work.


If I set
I get
XMLHttpRequest Exception

jquery.min.js:4 XMLHttpRequest cannot load localhost:3000/. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource


You need to use JSONP to overcome the Cross origin issue. Although both the Node server and your custom visiting webpage are on localhost, please note that there is a huge difference on configuration:

  • your custom visiting webpage is fully hosted on local LAMP stack*.
  • Node is only proxy/reverse-proxy configured locally (thanks to Vagrant automation) !

The real (virtual)IP of the Node server is the one configured on the vagrant VM, you can check it using ifconfig after opening a ssh session towards the VM. This way the HTTP response received from the page hosted locally has a different IP and domain in the header and the Cross origin exception is triggered.

*= supposing for example you are running a LAMP system.