无法获得简单的AngularJS $ http调用工作

时间:2014-02-09 04:55:57

标签: javascript angularjs

我正在组装我的第一个AngularJS应用程序。我的控制器正在进行$ http.get()调用。它正在使用的网址是正确的,但它最终用404调用“错误”方法。当我在Firebug中看到请求的URL时,这更令人困惑,并报告了200。

我认为我不需要为此显示html。我无法想象这是如何相关的。

这是我有点过时的javascript:

var diagapp = angular.module("DiagApp", ['ui.bootstrap', 'ngResource']);

diagapp.controller("DiagCtrl", ['$scope', '$interval', '$http', function($scope, $interval, $http) {
$http({method:'GET',url:'http://<hostportandpath>/service/diagnostics/datasourceStatus.json'})
    .success(function (data, status, headers, config) {
        console.log(data);
    })
    .error(function (data, status, headers, config) {
        console.log(data);
    });
}]);

我尝试在“$ http”行设置一个断点,然后将该行引用的URL复制并粘贴到另一个浏览器选项卡中,它向我显示该服务返回的正确json。然后我从断点继续,它在“错误”方法中命中断点,状态显示为404.

我可能做错了什么?

更新

我已对此进行了修改,以便服务调用只是相对的,因此它不会违反CDP。

我还设置了一个运行在我的webapp根目录下的“node express”Web服务器,因此它将为webapp中的文件请求提供服务,但是对REST服务的任何调用都被302重定向到另一个域上的服务

当我在Firebug中调试它时,我看到它得到302,然后我看到它得到200,所以它显然跟着重定向。然而,它然后在“错误”方法中击中断点,仍然说它得到了404.换句话说,我得到完全相同的结果。我迷糊了。

更新

这是我略微省略的“快速服务器”配置:

var express = require('express');
var app = express();

app.use("/", express.static(__dirname));
app.use(app.router);

app.get('/FooService/*', function(req, res) {
res.redirect(302, 'http://<hostname>' + req.path);
});

app.listen(8000);

1 个答案:

答案 0 :(得分:2)

我认为您收到错误是因为您向其他域发出了违反同源政策http://en.wikipedia.org/wiki/Same-origin_policy)的请求。相反,您应该向您自己的域上的服务器发出请求,并让该服务器提供您需要的数据(可能通过从其他域缓存它)。或者您可以使用JSON-P并将您的呼叫中的另一个域作为客户端的方法。

<强>更新

因此,要创建快速服务器,我们首先使用http库来生成request以获取我们想要的json数据,然后将响应存储在变量data中。然后我们就像你一样设置我们的网络服务器,除了不用响应重定向,我们用数据本身来响应。

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

// Make the request to buffer the data
var options = {
    host: 'somesite.com',
    port: 1337,
    path: '/some/path',
    method: 'GET',
    headers: {
        'Content-Type': 'application/json'
    }
};

var req = http.request(options, function(res)
{
    var output = '';

    res.on('data', function (chunk) {
        output += chunk;
    });

    res.on('end', function() {
        data = JSON.parse(output);
    });
});

req.on('error', function(err) {
    //res.send('error: ' + err.message);
});

req.end();

// Start the webserver to respond with the data

app.use("/", express.static(__dirname));
app.use(app.router);

app.get('/FooService/*', function(req, res) {
    response.writeHead(200, { 'Content-Type': 'application/json'});
        response.end(data);
});

app.listen(8000);

注意我还没有能够测试这一切,所以你可能需要做一些调整,但我已经完成了与Node,Express和Angular非常相似的事情,我确信这个事物的类型将起作用。您可能希望通过将请求放在setTimeout中或在app.get方法中按需提出请求来调整数据在服务器上缓存的频率(但这会更慢)。您可以在此处详细了解http.request():http://nodejs.org/api/http.html#http_http_request_options_callback