如何在没有服务器端代码的情况下使用 Web API,只使用 Ajax
Posted
技术标签:
【中文标题】如何在没有服务器端代码的情况下使用 Web API,只使用 Ajax【英文标题】:How to consume Web API without server side code, using only Ajax 【发布时间】:2017-11-08 19:16:01 【问题描述】:我在我的主机文件中添加了以下两个主机条目:
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);
);
上面输出如下错误:
请求的资源上没有“Access-Control-Allow-Origin”标头
如果不需要像 .Net 之类的后端服务器端代码,我该如何解决这个问题?
【问题讨论】:
这可能对你有用***.com/questions/20035101/… 刚刚更新了我的代码以使用 CORS 示例,我仍然遇到同样的问题 【参考方案1】:我终于在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);
);
【讨论】:
【参考方案2】:使用 JSONP
$.ajax(
url: url,
type: 'GET',
crossDomain: true,
contentType: "text/json",
dataType: "jsonp",
success: function (data) // ,
error: function (xhr, status, error)
);
【讨论】:
以上是关于如何在没有服务器端代码的情况下使用 Web API,只使用 Ajax的主要内容,如果未能解决你的问题,请参考以下文章
我如何在服务器端存储不记名令牌以及验证如何在 Web API 2 中注销时删除?
如何在没有 Web Audio API 的情况下直接从 ArrayBuffer 获取通道数据?
如何在没有 Web 源模块的情况下从 Oracle APEX 中的 API 获取数据