从客户端JavaScript AJAX调用Web API GET方法，得到错误

Question

我在本地计算机上托管了一个WebAPI，我试图通过JavaScript / JQuery / Ajax从应用程序中调用它。这个想法是，这个WebAPI将生活在与调用WebAPI（跨域）的服务器不同的服务器上。但是，现在情况并非如此 - 我正在使用localhost。

当我转到URL http://localhost/AppTools.WebAPI/api/BulletinBoard/AppName时，我按预期收到了JSON集合。

但是，我认为我可能做错了这个部分，当我尝试通过AJAX调用获取数据时（参见下面的代码），AJAX调用的error部分被击中，我有返回错误详细信息的消息框：

这是我的客户端代码：

$(document).ready(function () {
            $.ajax({
                url: 'http://localhost/AppTools.WebAPI/api/BulletinBoard/AppName',
                type: 'GET',
                dataType: 'json',
                success: function (data) {
                    WriteResponse(data);
                },
                error: function (x, y, z) {
                    alert(x + '\n' + y + '\n' + z);
                }
            });
});

function WriteResponse(messages) {
            var strResult = "<table><th>AppId</th><th>Message</th>";
            $.each(messages, function (index, message) {
                strResult += "<tr><td>" + message.AppId + "</td><td> " + message.Message + "</td></tr>";
            });
            strResult += "</table>";
            $("#divResult").html(strResult);
        }

我做错了什么？

Answer 1

我认为这仍然是跨域问题。将以下代码添加到Web.config文件中，它应该可以正常工作。

<system.webServer>
 <httpProtocol>
  <customHeaders>
   <add name="Access-Control-Allow-Origin" value="*" />
  </customHeaders>
 </httpProtocol>
</system.webServer>