Web API启用CORS无效

Question

我无法使用ajax访问asp.net-web-api中的资源。 我为所有请求启用了cors ，并添加了启用cors属性，但仍然出现错误： No 'Access-Control-Allow-Origin' header is present ...我也尝试过使用特定网站，但仍然存在相同错误。 我正在使用Visual Studio 2013 .Net Framework 4.5。

我可以使用与asp.net-web-api位于同一网站的html访问资源

码：

html ：

 <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script> function GetAllStudents() {  $.ajax({          type: "GET", url: "http://localhost/studentsWebapi/students", success: function(result) { var list = $("#students"); for (var i = 0; i < result.length; i++) { var students = result[i]; list.append('<li>' + student.FirstName + '</li>'); }            }, error: function(xhr) {        alert("here " + xhr.responseText);          }     }); } </script> </head> <body> <div id="data"> here <ol id="students"> </ol> <input type="button" onClick="GetAllStudents()"> click me </input> </div> </body> </html> 

Answer 1

由于某些问题，我无法执行您的项目，但是我做了一个示例项目，以通过HttpResponseMessage类演示解决方案。

您可以使用HttpResponseMessage类。 然后，您可以根据需要在响应标题中添加Access-Control-Allow-Origin: * 。

public HttpResponseMessage GetStudents()
{
    HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK, StudentRepository.GetAllStudents());
    response.Headers.Add("Access-Control-Allow-Origin", "*");
    return response;
}

---

保持项目结构是一个好习惯。 我对您的项目进行了一些更改，以使状态变得不稳定。

1. WebAPI项目。

App_Start / WebApiConfig.cs：我已经配置： routeTemplate: "api/{controller}/{action}/{id}"根据此架构进行请求。 示例： http://localhost:60604/api/students/getstudents 。

using System.Web.Http;

namespace WebAPI
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{action}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }
}

仓库/StudentRepository.cs：

using System.Collections.Generic;
using System.Linq;
using WebAPI.Models;

namespace WebAPI.Repository
{
    public class StudentRepository
    {
        private static List<Student> students = new List<Student> {
        new Student(){ StudentID=1, FirstName="Hass",LastName="Moh"},
         new Student(){ StudentID=2, FirstName="Hassan",LastName="Mohemm"},
          new Student(){ StudentID=3, FirstName="Hussan",LastName="Mohu"},
           new Student(){ StudentID=4, FirstName="Hessan",LastName="Moham"}
    };

        public static List<Student> GetAllStudents()
        {
            return students;
        }

        public static Student GetStudent(int studentID)
        {
            return students.Where(d => d.StudentID == studentID).First();
        }

        public static void RemoveStudent(int studentID)
        {
            var stu = students.Find(s => s.StudentID == studentID);
            students.Remove(stu);
        }

        public static void AddStudent(Student student)
        {
            students.Add(student);
        }

        public static void UpdateStudent(Student student)
        {
            //
        }
    }
}

型号/Student.cs：

namespace WebAPI.Models
{
    public class Student
    {
        public int StudentID { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }
}

API / StudentsController.cs：

using System.Collections.Generic;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using WebAPI.Models;
using WebAPI.Repository;

namespace WebAPI.API
{
    public class StudentsController : ApiController
    {
        public List<Student> Get()
        {
            return StudentRepository.GetAllStudents();
        }

        public HttpResponseMessage GetStudents()
        {
            HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK, StudentRepository.GetAllStudents());
            response.Headers.Add("Access-Control-Allow-Origin", "*");
            return response;
        }

        public Student Get(int id)
        {
            return StudentRepository.GetStudent(id);
        }

        public void Post(Student Student)
        {
            StudentRepository.AddStudent(Student);
        }

        public void Put(Student Student)
        {
            StudentRepository.UpdateStudent(Student);
        }

        public void Delete(int id)
        {
            StudentRepository.RemoveStudent(id);
        }
    }
}

2. WebApplication项目。

index.html：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
    <div id="data">
        <ol id="students"></ol>
        <input type="button" value=" click me" />
    </div>
    <script>
        $(function ()
        {
            $.ajax({
                type: "GET",
                url: "http://localhost:60604/api/students/getstudents",
                success: function (result)
                {
                    var list = $("#students"), student, html = "", len = result.length;
                    for (var i = 0; i < len; i++)
                    {
                        student = result[i];
                        html = "<li>";
                        html += student.FirstName;
                        html += "</li>";
                        list.append(html);
                    }
                },
                error: function (xhr)
                {
                    alert("here " + xhr.responseText);
                }
            });
        });
    </script>
</body>
</html>

然后，我们可以获得下一个结果。

希望这可以帮助。