2012-04-22 69 views
3

我一直在玩node.js,然后遇到了express框架。当使用不同的端口时,我似乎无法使其工作。node.js,express和不同的端口

我有我的阿贾克斯http://localhost:8888这是我在我的Mac上运行的MAMP服务器。

$.ajax({ 
    url: "http://localhost:1337/", 
    type: "GET", 
    dataType: "json", 
    data: { }, 
    contentType: "application/json", 
    cache: false, 
    timeout: 5000, 
    success: function(data) { 
     alert(data); 
    }, 
    error: function(jqXHR, textStatus, errorThrown) { 
     alert('error ' + textStatus + " " + errorThrown); 
    } 
}); 

正如你所看到的,我的node.js服务器正在运行在http://localhost:1337/上。结果没有任何东西被返回,并且抛出一个错误。

有没有办法解决这个问题?

感谢

+1

我明白你的问题的方式,你正在从localhost:8888加载一个网页,然后做一个$ .ajax调用localhost:1337。那是对的吗?如果是这样,那么你正在实施相同的原产地政策。 – Barend 2012-04-22 08:13:12

+0

这是正确的。那么解决这个问题的唯一方法就是从node.js服务器运行我的网站,使其具有相同的端口?但是如果我在我的网站上托管的端口80上实现了这个动作,并且我想连接到node.js服务器以进行搜索等请求呢?大多数人如何做到这一点? – 2012-04-22 08:16:34

+1

首选方法(恕我直言)是使用反向代理,使所有请求都转到同一主机/端口,并在幕后重新路由它们。一个不常见的解决方法是使用JSONP,但由于其安全性影响,我个人不喜欢这种方法。 – Barend 2012-04-22 08:18:24

回答

4

你的问题是,你是想做一个跨域请求,这不是通过浏览器(允许的是,相同的主机名与不同端口数的不同出于此目的)。您有三种选择:

1.代理请求。

如果可以,请执行此操作。写一些运行于:8888服务器 上的代码,该代码将请求代理到1337服务器。您还可以通过 贴在他们两人面前的代理做到这一点,像Nginx的是 在这个非常好,容易建立

2.使用CORS(跨源资源共享)

请参阅:http://en.wikipedia.org/wiki/Cross-origin_resource_sharinghttps://developer.mozilla.org/en/http_access_control

这意味着在响应中添加一些标题以告诉浏览器在这里交叉源请求是正确的。在您的Express服务器添加中间件这样的:

function enableCORSMiddleware (req,res,next) { 
    // You could use * instead of the url below to allow any origin, 
    // but be careful, you're opening yourself up to all sorts of things! 
    res.setHeader('Access-Control-Allow-Origin', "http://localhost:8888"); 
    next() 
    } 
server.use(enableCORSMiddleware); 

3.使用JSONP

这是你编码您的 “AJAX” 响应作为Javascript代码一招。然后,您要求浏览器加载该代码,浏览器将很高兴地将脚本加载到源代码中,以便解决跨源问题。它也让其他人也可以绕过它,所以确保这就是你想要的!

在您需要包装在JavaScript函数调用你的回应在服务器端,表示如果启用这样的“JSONP回调”选项,可以自动做到这一点:

server.enable("jsonp callback"); 

然后用发送您回应响应 “JSON()” 方法:

server.get("/ajax", function(req, res) { 
    res.json({foo: "bar"}); 
}); 

在客户端,你可以在jQuery的enanble JSONP只是在具体的数据类型选项改变 “JSON” 到 “JSONP”:

dataType: "jsonp",