Управление доступностью для кроссдоменных запросов в проектах ASP.NET Web API

| Среда, 12 июня, 2013

Метки: ASP.NET Web API Комментарии: 0

Включение CORS в web.config

Теперь, когда понятна проблема, давайте избавимся от ошибки. Самый простой способ добавить заголовок "Access-Control-Allow-Origin" в web.config. Откроем web.config проекта Web API и добавим следующую разметку в секцию <system.webServer>.

<system.webServer>
   <httpProtocol>
      <customHeaders>
         <add name="Access-Control-Allow-Origin" value="*"/>
         <add name="Access-Control-Allow-Headers" value="content-type"/> 
      </customHeaders>
   </httpProtocol>
	...
</system.webServer>

Здесь в секции <httpProtocol> добавлен заголовок http с именем "Access-Control-Allow-Origin" и значение для него "*", что значит запросы со всех доменов разрешены. Это включит спецификацию для Web API. И если запустить приложения, то ошибки уже не будет.

Поддержка спецификации CORS в ASP.NET Web API

Хотя способ включения CORS через web.config работает как и ожидалось, но он не позволяет контролировать что именно доступно для внешних доменов. Это просто глобальная настройка, которая открывает все ресурсы на домене. Как же можно конкретно определить, что открывать, а что нет? К счастью, в ASP.NET Web API планируется ввести управление спецификацей CORS через определенные атрибуты. На момент написания статьи (12 июня, 2013) сборки с поддержкой CORS для Web API доступны в "ночных билдах". Для получения этих сборок нужно подключить новый источник пакетов Nuget, как показано на рисунке ниже (картинка кликабельна):

Далее можно установить пакет Microsoft ASP.NET Web API Cross Origin Support.

Установка этого пакета добавляет ссылки на две сборки, которые отвечают за поддержку CORS:

1. System.Web.Cors.dll
2. System.Web.Http.Cors.dll

Применение поддержки CORS

После того, как установлена поддержка CORS для Web API, применим ее. Не забудьте убрать заголовок "Access-Control-Allow-Origin" из web.config, если он там есть. Открываем файл WebApiConfig.cs в проекте Web API и добавим в метод Register строку:

config.EnableCors();

Это включит поддержку CORS в проекте Web API. Но пока что ни один контроллер не поддерживает CORS. Чтобы это сделать, надо открыть контроллер ValuesController и добавить атрибут [EnableCors]:

[EnableCors("*", "*", "*")]
    public class ValuesController : ApiController
    {
        // GET api/values
        public IEnumerable<string> Get()
        {
            return new string[] { "Красный", "Зеленый", "Синий" };
        }
    *******

Атрибут [EnableCors] принимает три параметра: домены, заголовки и методы (origins, headers and methods). Значения "*" означают, что все домены, заголовки и методы доступны. Атрибут у контроллера позволяет вызывать все методы контроллера. Если нужно использовать только некоторые методы, то атрибут можно убрать у контролера и поместить над необходимыми методами.

public class ValuesController : ApiController
    {
        // GET api/values
        [EnableCors("*", "*", "*")]
        public IEnumerable<string> Get()
        {
            return new string[] { "Красный", "Зеленый", "Синий" };
        }
    *******

То есть сейчас метод Get доступен для других доменов, а остальные методы нет. Если нужно исключить методы, то используем атрибут [DisableCors]:

[EnableCors("*", "*", "*")]
    public class ValuesController : ApiController
    {
        // GET api/values
        [DisableCors]
        public IEnumerable<string> Get()
        {
            return new string[] { "Красный", "Зеленый", "Синий" };
        }
    *******

В этом случае будут доступны все методы, кроме Get.

Итак, спецификация CORS позволяет осуществлять междоменные AJAX-запросы. Поддержка CORS в проектах Web API реализована в сборках System.Web.Cors и System.Web.Http.Cors. Для управления доступностью используются атрибуты [EnableCors] и [DisableCors].