javascript - 使用 Ajax 调用 Web Api 2 方法

Question

我有一个用于移动项目的 Web Api 2 项目。我正在尝试将相同的 api 用于 Web 项目，但无法使用 ajax 访问它们。我已经确认我的 url 是正确的，并且我能够从 android 项目和 fiddler 访问端点。我错过了什么是我的ajax调用吗？我总是点击错误函数，它返回“未定义”。我可以在我的 webapi 项目中设置一个断点，并且该端点永远不会被击中。

// GET: api/Trips
public IQueryable<Trip> GetTrips()
{
     return db.Trips.Include("Users");
}

j查询

            $.ajax({
                url: 'http://localhost:49669/api/Trips',
                type: 'GET',
                contentType: 'application/json;charset=utf-8',
                success: function (data) {
                    alert("success!!");

                },
                error: function (x, y) {
                    alert(x.response);
                }
            });

Answer 1

如果尝试从浏览器访问 API，您可能需要启用 CORS。

第一步，修改你的WebApiConfig文件(App_Start/WebApiConfig.cs):

using System.Web.Http;
namespace WebService
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // Add this line
            config.EnableCors();

            // the rest of your code
        }
    }
}

第 2 步，将 [EnableCors] 属性添加到您的 Web API Controller :

using System.Net.Http;
using System.Web.Http;
using System.Web.Http.Cors;

namespace MyApp.Controllers
{
    [EnableCors(origins: "http://www.whatever.net", headers: "*", methods: "*")]
    public class HelloWorldController : ApiController
    {
        // GET: api/Trips
        public IQueryable<Trip> GetTrips()
        {
          return db.Trips.Include("Users");
         }
    }
}

**注意:**您可能还需要安装 CORS nuget 包。

Install-Package Microsoft.AspNet.WebApi.Cors