请求的资源上不存在“Access-Control-Allow-Origin”标头。 Jquery数据表

时间:2016-02-09 13:36:12

标签: jquery datatables

我使用Jquery数据表向我的应用程序的用户显示数据。我的数据来自使用Ajax的服务器。这就是我正在做的事情

$('#order-table').dataTable({
    "ajax": {
        "url": TippNett.Api.Url + "Order/DataTable",
        "data": function (d) {
            d.token = authToken;
        }
    },
    "processing": true,
    "serverSide": true,
    "columns": [
        { "data": "OrderType", render: getOrderTypeImg },
        { "data": "Location" },
        { "data": "MassType" },
        { "data": "Amount" },
        { "data": "RemainingAmount" },
        { "data": "CreatedDate" },
        { "data": "StartDate" },
        { "data": "EndDate" },
        { "data": "Org" }
    ]
});

它看起来很好,一切正常。但问题是,当我尝试搜索时,我有两个案例失败

  • 如果我复制要搜索的项目并将其粘贴到搜索框中我没有结果,并且在控制台中我收到以下错误
  

XMLHttpRequest无法加载http://api.tippnett.com/Order/DataTable?draw=18&columns%5B0%5D%5Bdata%5D=Or ... yggv& search%5Bregex%5D = false& token = 8587465804588061807sn6n& _ = 1455024583582。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许原点“http://www.tippnett.com”访问。响应的HTTP状态代码为404.

  • 第二种情况更奇怪。所以我要说我的桌子有不同位置的位置。其中一个是挪威。当我输入Norw时它会显示结果,但如果我继续输入,它会给我上面的错误。

我的服务器代码是这个

[HttpGet]
[AllowCrossSiteJson]
[AdminAttribute]
public dynamic DataTable([System.Web.Http.ModelBinding.ModelBinder(typeof(DataTablesBinder))] IDataTablesRequest requestModel)
    {
        int totalRecords = Order.GetAll().Count();

        IEnumerable<Order> list;
        if (requestModel.Search.Value != null && requestModel.Search.Value != "")
        {
            String searchValue = requestModel.Search.Value.ToLower();
            list = (from a in Order.GetAll().OrderByDescending(i => i.To)
                    where
                    a.Amount.ToString().ToLower().Contains(searchValue) ||
                    (a.Amount - a.MatchedAmount).ToString().ToLower().Contains(searchValue) ||
                    a.GetOrganization().Name.ToLower().Contains(searchValue) ||
                    a.GetLocation().FriendlyName.ToLower().Contains(searchValue) ||
                    a.GetMassType().Name.ToLower().Contains(searchValue) ||
                    a.From.ToShortDateString().ToLower().Contains(searchValue) ||
                    a.GetCreatedDate().ToShortDateString().ToLower().Contains(searchValue) ||
                    a.To.ToShortDateString().ToLower().Contains(searchValue)
                    select a);
        }
        else
            list = Order.GetAll().OrderByDescending(i => i.To);


        int filteredRecords = list.Count();

        DataTables.Mvc.Column orderColumn = requestModel.Columns.GetSortedColumns().FirstOrDefault();

        if (orderColumn != null)
        {
            Func<Order, String> keySelector;

            switch (orderColumn.Data)
            {
                default:
                case "MassType":
                    keySelector = r => r.GetMassType().Name;
                    break;
                case "Location":
                    keySelector = r => r.GetLocation().FriendlyName;
                    break;
                case "Org":
                    keySelector = r => r.GetOrganization().Name;
                    break;
                case "StartDate":
                    keySelector = r => r.From.ToShortDateString();
                    break;
                case "EndDate":
                    keySelector = r => r.To.ToShortDateString();
                    break;
                case "CreatedDate":
                    keySelector = r => r.GetCreatedDate().ToShortDateString();
                    break;
                case "Amount":
                    keySelector = r => r.Amount.ToString();
                    break;
                case "RemainingAmount":
                    keySelector = r => (r.Amount - r.MatchedAmount).ToString();
                    break;
            }

            if (orderColumn.SortDirection == Column.OrderDirection.Ascendant)
                list = list.OrderBy(keySelector);
            else
                list = list.OrderByDescending(keySelector);
        }

        list = list.Skip(requestModel.Start).Take(requestModel.Length).ToList();

        List<dynamic> data = new List<dynamic>();
        foreach (Order order in list)
        {
            Location loc = order.GetLocation();
            Organization org = order.GetOrganization();


            data.Add(new
            {
                DT_RowId = order.Id,
                Location = loc.FriendlyName,
                MassType = order.GetMassType().Name,
                Amount = order.Amount,
                RemainingAmount = order.Amount - order.MatchedAmount,
                CreatedDate = order.GetCreatedDate().ToShortDateString(),
                StartDate = order.From.ToShortDateString(),
                EndDate = order.To.ToShortDateString(),
                Org = org.Name,
                OrderType = order.OrderType.ToString()

            });
        }

        return new
        {
            draw = requestModel.Draw,
            recordsTotal = totalRecords,
            recordsFiltered = filteredRecords,
            data = data
        };
    }

以下是我处理CORS的方法

public class AllowCrossSiteJsonAttribute:ActionFilterAttribute     {

    public override bool Match(object obj)
    {
        return base.Match(obj);
    }

    public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
    {
        if (actionExecutedContext.Response != null)
        {
            if (actionExecutedContext.Request.Method.Method == "OPTIONS")
            {
                actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
                actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Headers", actionExecutedContext.Request.Headers.GetValues("Access-Control-Request-Headers"));

                actionExecutedContext.Response.Content.Headers.ContentType = new System.Net.Http.Headers.MediaTypeHeaderValue("application/json");

            }
        }

        base.OnActionExecuted(actionExecutedContext);
    }

}

1 个答案:

答案 0 :(得分:1)

我遇到的问题是因为我使用GET获取数据而不得不使用POST,因为我们对GET请求有限制。