Jquery Ajax 无法从 ASP.NET WEB API 获取数据

Question

我是 APS.NET MVC WEB API 编程的新手。

所以这是我的问题，我使用以下代码创建了一个 ASP.NET WEB API 项目

 public class ValuesController : ApiController
{
    // GET api/values
    public IEnumerable<Employee> Get()
    {
        return new List<Employee>()
        {
            new Employee(){ EmpId=1,EmpName="xyz" },
            new Employee(){EmpId=2,EmpName="abc"}
        };
    }

    // GET api/values/5
    public Employee Get(int id)
    {
        return new Employee() { EmpId = id, EmpName = "xyz" };
    }

}

简单吧..!!

接下来我创建了一个 html 文件并编写了一个 ajax 方法来从 web api 获取数据

 $(function () {
            var obj = {};
            $.ajax({

                type: "GET",
                url: "http://localhost:2797/api/values/1",
                data: JSON.stringify(obj),
                dataType: "JSON",
                contentType: "application/json; charset=UTF-8",
                success: function (data) {
                    alert(data.EmpName);
                },
                failure: function (data) {
                    alert("Error Occured");
                }

            });

        });

现在这是我的 jquery 脚本能够与 webapi 联系的问题，因为当 html 页面刷新时断点会中断，并且它也会返回值，但由于某种未知原因，成功函数中的警报消息不会命中。我不知道为什么

请帮忙

提前谢谢..!!

Answer 1

我终于找到了解决办法

首先转到工具->Nuget 包管理器-> 包管理器控制台

输入此命令Install-Package Microsoft.AspNet.WebApi.Cors -IncludePrerelease

然后在WebApiConfig.cs添加这行config.EnableCors();

现在用这个属性[EnableCors(origins:"*",headers:"*",methods:"*")]装饰你的apicontroller

但是在使用 post 方法使用 api 时，我们可能会遇到 cors 属性的一些问题

所以要避免它。我们可以全局声明 cors 属性

喜欢在WebApiConfig.cs写这段代码

var cors= new EnableCorsAttribute(origins:"*",headers:"*",methods:"*");
config.EnableCors(cors);

现在是 jquery 代码

$(document).read(function(){
    jquery.support.cors=true;
    $.ajax({
           type:"GET",
           url:"http://localhost:63300/api/values/1",
           crossDomain:true,
           contentType:"application/json; charset=utf-8",
           dataType:"json",
           success:function(data){
                alert(data);
           },
            error:function(data){
                alert('Error Occured..!');
            }
          });
});