20.08.2013

Кроссдоменный обмен данными между Web API и Web Application

В ходе работы над рабочим проектом довелось мне разрабатывать Web API для обмена данными с сайтом. API создавался как прослойка, содержащая всю основную бизнес-логику. Написан он был достаточно быстро и легко. Тестировать функционал я изначально решил в самом проекте с API, создав тестовый контроллер и вью, где должны были выводиться данные. Все тесты были успешно завершены, приложение работало без сбоев. Все это дело было на некоторое время отложено.

И вот настало время внедрять мой Web API в основной проект, он же сайт. Сразу оговорюсь, что в API была заложена защита, как же без нее. Авторизацию реализовал при помощи встроенной Forms Authentication. Также была внедрена защита от поддельных запросов с других сайтов или Preventing Cross-Site Request Forgery (CSRF) Attacks. То есть каждый входящий запрос проверялся на наличие валидного RequestVerificationToken. Проблемы начались, когда пришло время авторизовываться.

В ходе долгих странствий по интернету, было выяснено:

для того, что отправить авторизационные куки с одного домена на другой, требуется в запросе (будь то ajax, get или post) указывать следующий параметр:

xhrFields: {
    withCredentials: true
},

Ок, API успешно записывает куки в Response и при обратном запросе к API они присоединяются. Но все это добро работало лишь в Chrome. Ни в Mozilla FF, ни в IE 9 кроссдоменный обмен данными не шел.

Еще полдня на бесконечных просторах мировой паутины и решение найдено:

для FF требовалось на стороне API добавить в WebApiConfig в метод Register вот эти строки:
var cors = new EnableCorsAttribute(домен сайта, "*", "*");
config.EnableCors(cors);

для IE требовалось в скрипте страницы дописать строку:
jQuery.support.cors = true;

Решение не ахти какое, но рабочее.
Добавлено спустя некоторое время: решение работает только на localhost (:


Комментариев нет:

Отправить комментарий