从客户端 JavaScript AJAX 调用 WebAPI 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>