JQuery EasyUI Datagrid работает с одним веб-сервисом, но не с другим (одни и те же серверы)

Question

Я использую JQuery EasyUI's datagrid - это очень простая реализация.

Следующее из моего previous SO post (где мне удалось получить данные JAQuery EasyUI для загрузки данных из моего веб-сервиса с использованием подхода JavaScript). У меня теперь очень странная проблема, которую я не могу понять.

Короче говоря, один веб-сервис работает, а другой не совпадает, но код в основном идентичен, и обе веб-службы размещаются на одном сервере и используют CORS, поэтому у нас нет одинаковых проблем с исходным кодом. Я действительно не вижу никакой видимой разницы между кодом и их исполнением. Один работает, другой не ... Я могу только предположить, что это связано с ответом сервера API, но структура соответствует, они генерируются с одного и того же сайта и того же сервера ... все очень странно ... I используя .NET Web API 2 для вывода JSON.

Вот рабочая версия:

<table id="DGInProgress" class="easyui-datagrid" 
     data-options="singleSelect:true,collapsible:true,url:'https://www.driverlive.co.uk/rest/api/PushMessage/GetPushDriverMessagesList?DeviceId=a99f8a977696bfb9&DateFrom=2014-10-27T00:00:00&DateTo=2015-11-11T00:00:00',method:'get'"> 
    <thead> 
     <tr> 
      <th data-options="field:'MessageDated',width:80">Dated</th> 
      <th data-options="field:'PushNotificationMessage',width:100">Message</th> 
     </tr> 
    </thead> 
</table> 

Вот код, который не

<table id="DGInProgress" class="easyui-datagrid" 
     data-options="singleSelect:true,collapsible:true,url:'https://www.driverlive.co.uk/dispatch/api/BookingsInProgressLite/GetBookingsLite?dateTimeFrom=2014-01-01&dateTimeTo=2015-03-01&limit=100&json=true',method:'get'"> 
    <thead> 
     <tr> 
      <th data-options="field:'BookingReference',width:80">BookingReference</th> 
     </tr> 
    </thead> 
</table> 

Как вы можете видеть, как следовать той же разметки, и когда я осматриваю службы JSON веб-это слишком следует той же структуре.

Кроме того, Fiddler показывает, что был сделан запрос «получить» и что JSON был возвращен. Так почему будет сетки показывают данные для PushMessages API, а не Bookings API ...

Answer 1

Заголовок нерабочем ответ не позволяет CORS - это отсутствует Access-Control-Allow-Origin заголовок

Answer 2

@Kyle предоставил ответ о том, почему это не работает, но я хотел бы перечислить еще один ответ, подробно описывая причину и разрешение.

Здесь было два вопроса.

Во-первых, я следовал this article изначально для первого проекта, и все хорошо сработало. Я скользил по ней на второй проект, и хотя я установил CORS через NuGet Управление пакетами мне не удалось добавить строку:

// New code 
config.EnableCors(); 

В AppStart WebApiConfig.cs

После того как я сделал это, думая все было бы хорошо, это все еще не сработало.

Я попытался удалить ссылку на CORS, очистить, перестроить, добавить его и повторить ... до сих пор нет радости. Затем я повторно ссылался на всю библиотеку Web API 2, включая CORS, и до сих пор не радует. Я, наконец, использовал окно консоли диспетчера пакетов и заметил в тексте, что была зависимость от пакета Json, который требовал перезагрузки Visual Studio.

Я сделал это, а затем начал работать.

Другой «Gotcha» был тем, что я тестировал, чтобы увидеть, показывает ли теперь CORS заголовок Access-Control-Allow-Origin для показа в Fiddler. Однако я делал это, обратившись к API напрямую через мой браузер.Это никогда не показывало заголовок «Access-Control-Allow-Origin», поэтому меня обманули, полагая, что он все еще не работает. Мне нужно было запросить услугу через веб-приложение, чтобы увидеть заголовок «Access-Control-Allow-Origin» в Fiddler.