Angularjs 使用$http POST内容类型应用程序/x-www-form-urlencoded访问API

我正在尝试访问此REST API，它接受三个参数：

stationId

，

crusherId

，

monthYear

我在AngularJS中是这样做的：

$http({
        //headers: {'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'},
        //headers: {'Content-Type': 'application/json; charset=UTF-8'},
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8', 
            'Accept':       'application/json'
        },
        url:    'https://myurl../api/getHPData',
        method: 'POST',
        data: {
            stationId: 263, 
            crusherId: 27, 
            monthYear: '2016-4'
        }
    })

    .then(function(data, status, headers, config) {
            //console.log(JSON.stringify(response));
            console.log(data);
     })
    .catch(function(error){
            //console.log("Error: " + JSON.stringify(error));
            console.log(error);
        })

但我总是这样：

对象{data:“{”result:“false”}，状态：200，配置：Object，状态文本：“OK”，标题：function}

或

{“数据”：“{”结果\“：\”错误\“}”，“状态”：200，“配置”：“{”方法”：“POST”，“transformRequest”：[null]，“transformResponse”：[null]，“标题”：{“内容类型”：“application/x-www-form-urlencoded”； 字符集=UTF-8，“接受”：“应用程序/json”}，“url”：“数据”：{“stationId”：263，“crusherId”：27，“monthYear”：“2016-4”}}，“statusText”：“OK”}

如果我将

标题

内容类型

更改为：

headers: {'Content-Type': 'application/json; charset=UTF-8'},

它给出：

对象{数据：null，状态：-1，配置：对象，状态文本：“”，标题：函数}

或

{“data”：null，“status”：-1，“config”：{“method”：“POST”，“transformRequest”：[null]，“transformResponse”：[null]，“headers”：{“Content Type”：“application/json”； 字符集=UTF-8，“接受”：“应用程序/json，文本/plain， /“}”，url:“，”数据：{“stationId”：263，“crusherId”：27，“monthYear”：“2016-4”}，，“statusText”：“}”

我做错了什么，请帮帮我

普朗克在这里：

（编辑）

注意： 我可以在

jQuery

中这样做：

<script>
$(document).ready(function() {
        get_homepage_data(263, 27, '2016-04');

        function get_homepage_data(stationIds, crusherIds, date) {
            var url = "https://myurl../api/getHPData";
            var data_to_send = {
                'stationId': stationIds, 
                'crusherId': crusherIds,
                'monthYear': date
            };

            console.log("Value is: " + JSON.stringify(data_to_send));
            //change sender name with account holder name
            //        console.log(data_to_send)
            $.ajax({
                url: url,
                method:   'post',
                dataType: 'json',
                //contentType: 'application/json',
                data: data_to_send,
                processData: true,
                // crossDomain: true,
                beforeSend: function () {
                }
                , complete: function () {}
                , success: function (result1) {
                    var Result = JSON.parse(result1);
                    var value_data = Result["valueResult"];
                    var foo = value_data["gyydt"];

                    console.log("Log of foo is: " + foo);

                    var foo2 = 0;
                    // 10 lac is one million.
                    foo2 = foo / 1000000 + ' million';

                    console.log(JSON.stringify(value_data["gyydt"]) + " in million is: " + foo2);
                }
                , error: function (request, error) {
                    return false;
                }
            });
        }   
    }); // eof Document. Ready  
</script>

$（文档）.ready（函数（）{
获取主页数据（263,27，'2016-04'）；
函数获取主页数据（StationID、CrusherID、日期）{
变量url=”https://myurl../api/getHPData";
var数据发送={
“stationId”：stationId，
“十字军”：十字军，
“月”：日期
};
log（“值为：”+JSON.stringify（数据发送））；
//将发件人名称更改为帐户持有人名称
//console.log（数据发送）
$.ajax({
url:url，
方法：“post”，
数据类型：“json”，
//contentType:'应用程序/json'，
数据：要发送的数据，
processData：对，
//跨域：是的，
beforeSend:函数（）{
}
，完成：函数（）{}
，成功：函数（result1）{
var Result=JSON.parse（result1）；
var值_数据=结果[“valueResult”]；
var foo=价值数据[“gyydt”]；
log（“foo的日志为：“+foo”）；
var-foo2=0；
//10 lac等于100万。
foo2=foo/1000000+‘百万’；
log（JSON.stringify（value_data[“gyydt”]）+“百万分之一是：”+foo2）；
}
，错误：函数（请求，错误）{
返回false；
}
});
}   
}); // eof文件。准备好的

上述脚本的输出为

脚本

为：

• 值为：{“stationId”：263，“crusherId”：27，“monthYear”：“2016-04”}
• XHR已完成加载：POST “”
• foo的日志是：26862094
• 以百万计的“26862094”为：26862094万

这是完美的。：）

说stationId和crusherId参数应该是字符串数组。另外，看起来您正在发送JSON数据，因此请确保正确设置该标头

$http({
    headers: {
        'Content-Type': 'application/json', 
        'Accept':       'application/json'
    },
    url:    'https://fnrc.gov.ae/roayaservices/api/getHPData',
    method: 'POST',
    data: {
        stationId: ['263'], 
        crusherId: ['27'], 
        monthYear: '2016-4'
    }
})

当我更改plunkr中的代码以使用上面更正的代码时，我得到以下响应：“请求的资源不支持http方法‘选项’。”

正如正确提到的另一个（现已删除）答案，这意味着存在CORS问题。浏览器试图在发出跨源请求之前发送“飞行前”请求，而服务器不知道如何处理该请求。您也可以在Chrome控制台中看到此消息：

无法加载XMLHttpRequest . 回应 飞行前的HTTP状态代码405无效

表示stationId和crusherId参数应该是字符串数组。另外，看起来您正在发送JSON数据，因此请确保正确设置该标头

$http({
    headers: {
        'Content-Type': 'application/json', 
        'Accept':       'application/json'
    },
    url:    'https://fnrc.gov.ae/roayaservices/api/getHPData',
    method: 'POST',
    data: {
        stationId: ['263'], 
        crusherId: ['27'], 
        monthYear: '2016-4'
    }
})

当我更改plunkr中的代码以使用上面更正的代码时，我得到以下响应：“请求的资源不支持http方法‘选项’。”

正如正确提到的另一个（现已删除）答案，这意味着存在CORS问题。浏览器试图在发出跨源请求之前发送“飞行前”请求，而服务器不知道如何处理该请求。您也可以在Chrome控制台中看到此消息：

无法加载XMLHttpRequest . 回应 飞行前的HTTP状态代码405无效

---

发布URL编码的表单数据时，使用以下命令转换请求：

通常，$http服务自动解析JSON编码对象的结果，但此API返回的字符串已从对象双重序列化。

transformResponse

功能修复了该问题

---

发布URL编码的表单数据时，使用以下命令转换请求：

通常，$http服务自动解析JSON编码对象的结果，但此API返回的字符串已从对象双重序列化。

transformResponse

功能修复了该问题

---

该

不起作用，我也尝试了，它返回：

{“data”：“{”result\：“false\”}”，“status”：200，“config”：{”method:“POST”，“transformRequest:[null]，“transformResponse:[null]，“headers:{”Content Type:“application/x-www-form-urlencoded；charset=UTF-8”，“Accept:“application/json”}，“url”："https://fnrc.gov.ae/roayaservices/api/getHPData“，“数据”：{“stationId”：[263]，“crusherId”：[27]，“monthYear”：“2016-4”}}，，“statusText”：“OK”}

@fWd82既然您发送的是JSON，您还应该设置您的内容类型。”