node.js / jQuery跨域:ERR_CONNECTION_REFUSED

时间:2015-04-27 21:19:11

标签: javascript node.js express

我是Node.js的新手。

我正在创建一个简单的节点/快速应用程序,该应用程序为包含一个按钮的单个网页提供服务,单击该按钮时会向Express路由发出jQuery ajax请求。

对于包含外汇汇率的某些json数据,路由回调向openexchangerates.org发出http.get请求。然后将JSON输出到Developer Tools控制台窗口。

该应用程序适用于第一次按钮单击,但在随后的任何点击中,控制台窗口显示:

GET http://127.0.0.1:3000/getFx net::ERR_CONNECTION_REFUSED

Developer Tools控制台窗口的屏幕抓取显示第一次单击的结果,然后在拒绝连接时显示第二次单击。

enter image description here

错误详情如下:

GET http://127.0.0.1:3000/getFx net::ERR_CONNECTION_REFUSED    jquery-2.1.3.min.js:4
n.ajaxTransport.k.cors.a.crossDomain.send    jquery-2.1.3.min.js:4   
n.extend.ajax           (index):18
(anonymous function)    jquery-2.1.3.min.js:3
n.event.dispatch        jquery-2.1.3.min.js:3
n.event.add.r.handle

我的简单Node / Express应用程序如下:



var express = require('express');
var app = express();
var http = require("http");
var data = "";
var json;

console.log( "__dirname", __dirname );
app.use( express.static( __dirname + '/') );

var options = {
  host:"openexchangerates.org",
  path:"/api/latest.json?app_id=<get free ID from openexchangerates.org>"
};

app.get("/", function( req, res ) {
  res.sendFile('index.html', { root: __dirname });
})

app.get("/getfx", function(req, res) {
  console.log("Route: getFx");
  getFx(res);
})

function getFx(res) {
  console.log("http getFx");
  http.get(options, function (response) {
    response.on("data", function (chunk) {
      //console.log("data:\n"+chunk);
      data += chunk;
    });
    response.on("end", function () {
      json = JSON.parse(data);
      console.log("http response end:");
      res.end( data );
    });
    response.on("error", function (e) {
      console.log("error:\n" + e.message);
    });
  })
}

app.listen(3000);
&#13;
&#13;
&#13;

我的html索引页是:

&#13;
&#13;
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Get FX</title>
    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script>
        $(document).ready(function() {
            console.log( "document ready");
           $("#btnFx").click(function() {
                console.log('clicked', this );
                $.ajax({
                    url : "http://127.0.0.1:3000/getFx",
                    dataType : "json",
                    success : function(json) {
                        console.log("json returned:\n", json);
                    }
                });
            } );
        })
    </script>

</head>
<body>
    <button id="btnFx" style="width:200px">Get foreign exchange rates</button>
</body>
&#13;
&#13;
&#13;

对于openexchangerates.org来提供数据,需要一个免费的应用程序ID。任何能够帮助解决此问题的人都可能需要通过他们的简短注册:

该链接在这里:

https://openexchangerates.org/signup/free

然而,对于那些具有更好的Node / Express / jQuery知识的人来说,我的错误可能是显而易见的。

非常感谢提前

2 个答案:

答案 0 :(得分:3)

您定义datajson vars的方式导致后续请求失败。由于您预先定义了它们,所有请求都将重用它们,这意味着当您为第二个请求JSON.parse data时,data将包含两个有效的json字符串,从而使一个无效的json串。要解决此问题,请在回调中进一步定义datajson

var express = require('express');
var app = express();
var http = require("http");
//var data = "";
//var json;

console.log( "__dirname", __dirname );
app.use( express.static( __dirname + '/') );

var options = {
  host:"openexchangerates.org",
  path:"/api/latest.json?app_id=<get free ID from openexchangerates.org>"
};

app.get("/", function( req, res ) {
  res.sendFile('index.html', { root: __dirname });
})

app.get("/getfx", function(req, res) {
  console.log("Route: getFx");
  getFx(res);
})

function getFx(res) {
  console.log("http getFx");
  http.get(options, function (response) {
    var data = "";
    var json;
    response.on("data", function (chunk) {
      //console.log("data:\n"+chunk);
      data += chunk;
    });
    response.on("end", function () {
      console.log("http response end:");
      json = JSON.parse(data);
      res.json(json);
    });
    response.on("error", function (e) {
      console.log("error:\n" + e.message);
    });
  })
}

app.listen(3000);

答案 1 :(得分:0)

问题来自于使用chrome在localhost上发生的跨源请求保护。尝试使用其他浏览器或只允许来自所有主机(*)或主机(http://localhost:3000):

app.use( express.static( __dirname + '/') );
app.use(function(req,res,next){
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');

    // intercept OPTIONS method
    if ('OPTIONS' == req.method) {
        res.send(200);
    }
    else {
        next();
    }
});