1

您好我正在尝试编写一个角度工厂来使用来自 random.org Web api 的数据。我正在使用没有 JQuery 的角度。我的应用程序无法从 Web 服务加载数据，发出一些 CORS 错误信号，我使用的代码如下所示。任何输入表示赞赏：

'use strict';
angular.module('TrueDice.services', [])

/**
 * A simple example service that returns some data.
 */
    .factory('TrueRandomService', function ($http) {



        var xsrf=({
            'jsonrpc': '2.0',
            'method': 'generateIntegers',
            'params': {
                'apiKey': 'd2319b89-8389-4d24-b1eb-4dbd80009153',
                'n': 1,
                'min': 1,
                'max': 6,
                'replacement': true,
                'base': 10
            },
            'id': 27846
        });


        return{
            getRand: function (numberOfDices) {
                return $http({
                    url: 'https://api.random.org/json-rpc/1/invoke',
                    method: 'POST',
                    headers:{'Content-Type':'application/json-rpc'},
                    data: xsrf
                });
            }
        };
    });

错误是：

XMLHttpRequest 无法加载https://api.random.org/json-rpc/1/invoke。Access-Control-Allow-Headers 不允许请求标头字段 Content-Type。

Angular 应用程序位于 Cordova 中，配置如下：

    <access origin="*" />
4

1 回答 1

1

API athttps://api.random.org/json-rpc/1/invoke没有响应 header Access-Control-Allow-Headers: accept, content-type。因此浏览器拒绝 CORS 请求。

您可以使用 CORS 代理解决此问题。有几个项目可以用于测试（例如cors-anywhere作为 npm 模块提供）。

我准备了一个演示，展示了它的实际效果。

代理将您的请求转发到目标并将所需的 CORS 标头添加到响应中，以便浏览器停止抱怨。当您查看来自代理的响应标头时，您会发现：

Access-Control-Allow-Headers:accept, content-type
Access-Control-Allow-Methods:POST
Access-Control-Allow-Origin:*
Access-Control-Expose-Headers:location,x-request-url,x-final-url
于 2014-05-11T14:24:27.867 回答