如何在没有服务器端代码的情况下使用Web API,仅使用Ajax

时间:2017-06-07 12:25:58

标签: jquery asp.net .net ajax

我在主机文件中添加了以下两个主机条目:

  

127.0.0.1 na_api.com

     

127.0.0.1 na_upload.com

127.0.0.1 na_api.com用于从数据库中检索一些数据并返回JSON,而127.0.0.1 na_upload.com是一个使用API​​的网站。

目前,我有以下Ajax调用,用于调用API并获取一些数据。这是Ajax调用:

this.ajaxRetrieve = function (url, data, onSuccessCallback) {
    $.ajax({
        url: url,
        data: data,
        type: 'GET',
        crossDomain: true,
        onsuccess: function (result) {
            onSuccessCallback(result);
        }
    });
}

以上输出以下错误:

  

否'访问控制 - 允许 - 来源'标头出现在请求的资源上

如何在不需要后端服务器端代码(如.Net或其他东西)的情况下解决这个问题?

2 个答案:

答案 0 :(得分:1)

使用JSONP

$.ajax({
                                url: url,
                                type: 'GET',
                                crossDomain: true,
                                contentType: "text/json",
                                dataType: "jsonp",
                                success: function (data) { // },
                                error: function (xhr, status, error) { }
                          });

答案 1 :(得分:0)

我终于在this文章中找到了对我有用的东西。

我将以下内容添加到我的Web API的Web.config文件中,位于<syetm.webServer>部分

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Headers" value="Content-Type" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
  </customHeaders>
</httpProtocol>

这是我用来发出请求的Ajax调用:

$.ajax({
        url: url,
        data: data,
        type: 'GET',
        async: false,
        success: function(result) {
            onSuccessCallback(result);
        },
        error: function(xhr, status, error) {
            onErrorCallback(xhr, status, error);
        }
    });