Question

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

Rest api url中有一个端口号，由AngularJS为变量插入。我徒劳地尝试了几种解决方案。
我遇到了JSONP方法的问题。 Rest api不托管在同一个域/服务器上，因此简单的get不起作用。
其余api的参数是斜杠分隔而不是HTML查询字符串。其中一个参数是电子邮件地址，我认为'@'符号也会导致一些问题。我也无法解决这个问题。

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

Answer 1

我在这个问题上遇到了很多困难，所以希望这将有助于未来的某些人：）

JSONP期望一个函数回调，一个常见的错误是调用返回JSON的URL，并且你得到一个 Uncaught SyntaxError：Unexpected token：错误。相反，JSONP应该返回这样的东西（不要挂在示例中的函数名称上）：

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

documentation告诉您在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);

Answer 2

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

Answer 3

关于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}, …)

Answer 4

尝试逃避＆＃39;：＆＃39; var url =＆＃39; http：//myserver.com \：8888 / dodthing / me@mydomain / arg2＆＃39 ;; 我很确定我在其他地方读到了这个

使用jsonp的AngularJS资源服务失败

4 个答案: