2

我正在尝试在 AngularJS 中获取 rest api 的 JSON 输出。以下是我面临的问题：

  • Rest api url 中包含端口号，AngularJS 为变量插值。我为此尝试了几个解决方案，但都是徒劳的。
  • 我在使用 JSONP 方法时遇到问题。Rest api 未托管在同一域/服务器上，因此简单的 get 不起作用。
  • 其余 api 的参数是斜杠分隔的，不像 HTML 查询字符串。其中一个参数是电子邮件地址，我认为“@”符号也会引起一些问题。我也无法解决这个问题。

我的 rest api 看起来像：http://myserver.com:8888/dosomething/me@mydomain.com/arg2. 示例代码/文档将非常有帮助。

4

4 回答 4

5

我在这个问题上挣扎了很多，所以希望这对将来的人有帮助:)

JSONP 需要一个函数回调，一个常见的错误是调用一个返回 JSON 的 URL，你会得到一个Uncaught SyntaxError: Unexpected token :错误。相反，JSONP 应该返回类似这样的内容（不要纠结于示例中的函数名称）：

angular.callbacks._0({"id":4,"name":"Joe"})

文档告诉您在URL 上传递 JSON_CALLBACK 是有原因的。这将被替换为回调函数名称来处理返回。每个 JSONP 请求都分配了一个回调函数，因此如果您执行多个请求，它们可能由 angular.callbacks._1、angular.callbacks._2 等处理。

考虑到这一点，您的请求应该是这样的：

var url = 'http://myserver.com:8888/dosomething/me@mydomain.com/arg2';
$http.jsonp(url + '?callback=JSON_CALLBACK')
   .then(function (response) {
       $scope.mydata = response.data;
       ...

然后 AngularJS 将实际请求（替换 JSON_CALLBACK）：

http://myserver.com:8888/dosomething/me@mydomain.com/arg2?callback=angular.callbacks._0

有些框架支持JSONP，但是如果你的api没有自动做，你可以从查询字符串中获取回调名称来封装json。示例在 Node.js 中：

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

app.get('/', function(req, res){
    // do something to get the json
    var json = '{"id":4,"name":"Joe"}';

    res.writeHead(200, {"Content-Type": "application/javascript"});
    res.write(req.query.callback + '(' + json + ')');
    res.end();
});
app.listen(8888);
于 2013-04-21T02:28:35.097 回答
2

我在这里面临的主要问题与CORS有关。我通过禁用 Chrome 中的网络安全性获得了 $http 从服务器检索 JSON 数据 ---disable-web-security在启动 Chrome 时使用该标志。

于 2012-11-25T15:41:31.487 回答
0

关于 8888 端口，看看这是否有效：

$scope.url  = 'http://myserver.com:port/dosomething/:email/:arg2';
$scope.data = $resource($scope.url, {port:":8888", email:'me@mydomain.com', 
                 arg2: '...', other defaults here}, …)
于 2012-11-15T22:23:43.220 回答
-1

尝试转义 ':' var url = 'http://myserver.com\:8888/dosomething/me@mydomain.com/arg2'; 很确定我在其他地方读到过这个

于 2013-05-24T21:59:21.467 回答