调用Redmine API时jsonp获得404

时间:2015-12-16 16:33:23

标签: javascript angularjs jsonp redmine-api

我正在尝试从angularjs项目中使用Redmine API。

我最终使用jsonp来解决CORS问题。

我在致电时收到404:

var url = 'http://muser:mpasswd@myredmine/issues.json?callback=displayIssues';
 $http({
                method: 'JSONP',
                url: url
            }).
            success(function (data, status) {
                console.log("success");
                console.log(data);
            }).
            error(function (data, status) {
                console.log("Error: " + status);
            });
...
    function displayIssues(issues) {
                console.log('displayIssues');
                ...
            }

但是当我用Postman调用相同的URL时,它可以工作。

为什么我收到这个404?

这是我的控制台:

GET http://muser:mpasswd@myredmine/issues.json?callback=displayIssues jsonpReq @ angular.js:8576(anonymous function) @ angular.js:8420sendReq @ angular.js:8291serverRequest @ angular.js:8025wrappedCallback @ angular.js:11498wrappedCallback @ angular.js:11498(anonymous function) @ angular.js:11584Scope.$eval @ angular.js:12608Scope.$digest @ angular.js:12420Scope.$apply @ angular.js:12712(anonymous function) @ angular.js:18980x.event.dispatch @ jquery-2.0.3.min.js:5y.handle @ jquery-2.0.3.min.js:5
authentication.service.js:100 Error: 404

Rest API和jsonp都在admin-> setting-> auth

中启用

我也尝试过:

        var url = 'http://muser:mpasswd@myredmine/redmine/issues.json&callback=JSON_CALLBACK';
        $http.jsonp(url, {
            params: {
                callback: 'JSON_CALLBACK',
                format: 'json'
            }
        }).success(function (data) {
            console.log('ok');
        }).error(function (data) {
            console.log('error: ' + JSON.stringify(data));
        });

得到这个:

GET http://muser:mpasswd@myredmine/issues.json&callback=angular.callbacks._0?callback=JSON_CALLBACK&format=json jsonpReq @ angular.js:8576(anonymous function) @ angular.js:8420sendReq @ angular.js:8291serverRequest @ angular.js:8025wrappedCallback @ angular.js:11498wrappedCallback @ angular.js:11498(anonymous function) @ angular.js:11584Scope.$eval @ angular.js:12608Scope.$digest @ angular.js:12420Scope.$apply @ angular.js:12712(anonymous function) @ angular.js:18980x.event.dispatch @ jquery-2.0.3.min.js:5y.handle @ jquery-2.0.3.min.js:5
services.js:35 error: undefined

另外,在调用时:

var url = 'http://muser:mpasswd@myredmine/redmine/issues.json&callback=JSON_CALLBACK';
            $http.jsonp(url).success(function (data) {
                console.log('success');
            }).error(function (error) {
                console.log('error:: ' + error);
            });

我得到了同样的错误

请考虑muser,mpasswd和myredmine就是例子。

2 个答案:

答案 0 :(得分:5)

来自ngDocs

  

回调的名称应该是字符串JSON_CALLBACK

Angular会在内部使用angular.callbacks_{0-9a-z}

替换该字符串

首先将代码更改为:

var url = 'http://muser:mpasswd@myredmine/redmine/issues.json?callback=JSON_CALLBACK';
$http.jsonp(url).succe...

使用此fiddle似乎Redmine从网址中删除了点.,从而使angular.callbacks_0angularcallback_0未定义。
您可以在github上阅读更多内容,但有一个问题。

可能的解决方案

1)其他用户在SO here上发布了一个hack,用于将回调的名称更改为自定义回调。

根据@ Todi-Adiatmo的黑客工作fiddle

2)根据@dancras在github上发布的问题上找到的另一个解决方案是通过调用angularcallbacks_{..}定义未定义的angular.callbacks_{..}然后删除全局angularcallbacks_ 您必须在jsonp调用之前立即使用它:

var c = $window.angular.callbacks.counter.toString(36);

$window['angularcallbacks_' + c] = function (data) {
    $window.angular.callbacks['_' + c](data);
    delete $window['angularcallbacks_' + c];
};

根据@ danca的解决方案工作fiddle

答案 1 :(得分:0)

我看到你的控制台显示了这个: -

获取http://muser:mpasswd@myredmine/issues.json?callback=displayIssues

从技术上讲,这不是HTTP中的有效URL。根据。

,用户名和密码不应该在GET调用中,它们应该在标题中

https://en.wikipedia.org/wiki/Basic_access_authentication

谷歌上的快速搜索找到了这个https://docs.angularjs.org/api/ng/service/ $ http和 angularjs basic authentication headers

我多年没有看过redmine了,它可能只是简单地使用之前的答案指定的选项处理狡猾的HTTP,但是如果这不起作用,请检查请求是否实际上正确地进入Redmine