0

嗨，我必须编写将服务跨域请求的 Rest API 调用

我已经根据请求与 Mozilla（rest 客户端）进行了核对，它现在为我提供了如何通过 html 中的 jquery/javascript 编写的数据。

{"POST to adengine":{"method":"POST","url":"http://xxx.com/Advertisement/1.0/GetAds","body":"aid=Apposaurus_xxx","overrideMimeType":false,"headers":[["Content-Type","application/x-www-form-urlencoded"]]}}

这是我在 html 中的示例代码

<html>
<title></title>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">

JSONTest = function() {
    var resultDiv = $("#resultDivContainer");
    $.ajax({
        url: "http://xxx.com/Advertisement/1.0/GetAds",
        type: "POST",
        data:  "aid=Apposaurus_xxx",        
        overrideMimeType:'false',
        crossDomain: 'true',
        dataType: 'jsonp',
        headers:{"Content-Type":'application/x-www-form-urlencoded'},

        success: function (result) {
            switch (result) {
                case true:
                     processResponse(result);
                    break;
                default:
                    resultDiv.html(result);
            }
        },
        error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        }    
});
};
</script>
</head>
<body>


<div id="resultDivContainer"></div>

<button type="button" onclick="JSONTest();">JSON</button>

</body>
</html>

我哪里错了？

4

2 回答 2

0

跨域请求应该使用 JSONP 来完成。JSONP 代表带有 Padding 的 JSON。我会在这里稍微解释一下。

你想如何从服务器获取数据（当我们谈论 JSON 时的脚本）？你有两种方法：

  1. 一个 ajax 请求，它在后台使用XMLHttpRequest对象实例完成，并且仅限于发送到同一个域，
  2. 一个简单的 HTTP Get 请求，通过<script>在 HTML 文档的某处插入一个标签来完成，主要是在 head 部分。

第二种技术不限于跨域策略。但是，让我们看看浏览器在这两种情况下如何作为我们的代理工作：

ajax 场景：开发者代码 => 浏览器 => 请求 => 服务器 => 响应 => 浏览器 => 开发者代码。这意味着当您使用 ajax 时，浏览器会代表您创建一个 HTTP 请求（带有X-Requested-With: XMLHttpRequest标头字段）并将其发送到服务器，然后它会获取响应库，*但它会将响应返回给您，以便作为开发人员，您有机会分析响应并使用它做任何您想做的事情。

HTTP Get 场景：开发者代码 => 头部中的脚本标签 => 浏览器 => 请求 => 服务器 => 响应 => 浏览器 => 响应执行。

看？当您使用 JSONP 或<script>在 head 中插入简单标记时，浏览器会从服务器获取脚本，但它会运行脚本，这就是结束。您还没有被响应所吸引，并且您无法控制它。因此，您需要callback为它提供一个函数。callback({})不同之处在于{}，当它被执行时，它让你有机会得到结果并用它做一些事情。

于 2013-02-07T06:01:51.310 回答
0

您能否稍微更改您的代码并告诉我们控制台记录了什么？请不要使用 IE，因为它有一个可怕的 console.log 实现（显示 Object.Object）。带有 Firebug 的 Chrome 或 Firefox 会做得更好。

建议更改：

        success: function (result) {
console.log("here is the result:",result);
//            switch (result) {
//                case true:
//                     processResponse(result);
//                    break;
//                default:
//                    resultDiv.html(result);
//            }
        },
        error: function (xhr, ajaxOptions, thrownError) {
console.log("this is the error",arguments);
//        alert(xhr.status);
        }
于 2013-02-07T06:15:25.273 回答