Client ASP.NET MVC + Angular и Server side ASP.NET WEB.API

@naximuz · Регистрация: 23.10.2009

Студворк — интернет-сервис помощи студентам

Доброго времени суток!
Не первый день бьюсь над задачей, не могу понять в чем причина.

Хочу создать почти HelloWorld решение, для обмена информацией между клиентом и сервером посредством Angular (разные адреса ресурсов).

Серверная часть, стандартная функция (как ValuesController) для метода GET и POST, контроллер требует авторизации.

Клиентская часть, страница регистрации и авторизации и страница получения данных (метод GET) и страница отправки данных (метод POST).

В конфигурации сервера указал разрешение для соединения:

HTML5
1
2
3
4
5
6
7
<httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="http://localhost:16174" />
      <add name="Access-Control-Allow-Headers" value="Content-Type, authorization, Accept, X-Requested-With" />
      <add name="Access-Control-Allow-Methods" value="GET, POST" />
    </customHeaders>
  </httpProtocol>

Метод для GET выглядит проще некуда:

C#
1
2
3
4
5
[HttpGet]
        public IEnumerable<string> Get()
        {
            return new string[] { "GET1", "GET2" };
        }

и для POST:

C#
1
2
3
4
5
[HttpPost]
        public IEnumerable<string> Post()
        {
            return new string[] { "POST_Param1", "POST_Param2" };
        }

У контроллера атрибут Authorize.

Клиентская часть:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var serverAddress = "http://localhost:1513";
 
var app = angular.module('appHello');
 
app.controller("controllerHello", [
        "$scope", "$http", function ($scope, $http) {
 
            var token = sessionStorage.getItem(tokenKey);
 
            $http({
                method: 'GET',
                url: serverAddress + '/api/EmployeeAPI',
                headers: { 'authorization': 'bearer ' + token }
            }).then(function(response) {
                $scope.cash = response.data;
 
            }, function(response) {
                console.error("Connect error");
            });
        }
    ]);

Результат запроса:

Request:

OPTIONS /api/EmployeeAPI HTTP/1.1
Host: localhost:1513
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: GET
Origin: http://localhost:16174
User-Agent: Mozilla/5.0 (Windows NT 6.2; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.35 Safari/537.36
Access-Control-Request-Headers: authorization
Accept: */*
Referer: http://localhost:16174/Employee/Index
Accept-Encoding: gzip, deflate, sdch, br
Accept-Language: ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4

Response:

HTTP/1.1 405 Method Not Allowed
Cache-Control: no-cache
Pragma: no-cache
Allow: GET
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/8.0
X-AspNet-Version: 4.0.30319
X-SourceFiles: =?UTF-8?B?QzpcU2l0ZXNcVGVzdFxUZXN0U2RcU291cmNl XFNlcnZlclxhcGlcRW1wbG95ZWVBUEk=?=
X-Powered-By: ASP.NET
Access-Control-Allow-Origin: http://localhost:16174
Access-Control-Allow-Headers: Content-Type, authorization, Accept, X-Requested-With
Access-Control-Allow-Methods: GET, POST
Date: Wed, 09 Nov 2016 18:59:34 GMT
Content-Length: 108

Ответ сервера:
{"Message":"Запрошенный ресурс не поддерживает HTTP-метод "OPTIONS"."}

Проблема заключается в том что не могу понять почему отправляется кросс-доменный запрос OPTIONS а обоих случаях что GET что POST а не GET или POST.
Если свои заголовки не подключать (authorization для передачи токена) то запрос корректно уходит.

Что я делаю не так, в чем проблема?

@sau · 10.11.2016, 01:17

Тут дело не в asp net , это некоторые браузеры при кросс-доменных запросах делают предварительные проверочные запросы. - из соображений безопасности , на что сервер может отреагировать и дать запрет. если потребуется.

В вашем случае , нужно просто разрешить данный тип запроса , на уровне веб.апи это делается через config.EnableCors из пакета Microsoft.AspNet.WebApi.Cors

П.С Если скрипт запроса исполняется в том же домене , не нужно указывать полный адрес , достаточно указать относительный путь.

@naximuz · 10.11.2016, 08:21 **[ТС]**

Действительно, ответ был прост.
Спасибо за подсказку, перепроверил с предварительными методами, GET и POST работают корректно.
Успехов в программировании!

Новые блоги и статьи Все статьи Все блоги /
Unity 4D GameUnited 13.06.2025 Четырехмерное пространство. . . Звучит как что-то из научной фантастики, правда? Однако для меня, как разработчика со стажем в игровой индустрии, четвертое измерение давно перестало быть абстракцией из. . .	SSE (Server-Sent Events) в ASP.NET Core и .NET 10 UnmanagedCoder 13.06.2025 Кажется, Microsoft снова подкинула нам интересную фичу в новой версии фреймворка. Работая с превью . NET 10, я наткнулся на нативную поддержку Server-Sent Events (SSE) в ASP. NET Core Minimal APIs. Эта. . .	С днём независимости России! Hrethgir 13.06.2025 Решил побеседовать, с утра праздничного дня, с LM о завоеваниях. То что она написала о народе, представителем которого я являюсь сам сначала возмутило меня, но дальше только смешило. Это чисто. . .	Лето вокруг. kumehtar 13.06.2025 Лето вокруг. Наполненное бурями и ураганами событий. На фоне магии Жизни, священной и вечной, неумелой рукой человека рисуется панорама душевного непокоя. Странные серые краски проникают и. . .	Популярные LM модели ориентированы на увеличение затрат ресурсов пользователями сгенерированного кода (грязь -заслуги чистоплюев). Hrethgir 12.06.2025 Вообще обратил внимание, что они генерируют код (впрочем так-же ориентированы разработчики чипов даже), чтобы пользователь их использующий уходил в тот или иной убыток. Это достаточно опытные модели,. . .
Топ10 библиотек C для квантовых вычислений bytestream 12.06.2025 Квантовые вычисления - это та область, где теория встречается с практикой на границе наших знаний о физике. Пока большая часть шума вокруг квантовых компьютеров крутится вокруг языков высокого уровня. . .	Dispose и Finalize в C# stackOverflow 12.06.2025 Работая с C# больше десяти лет, я снова и снова наблюдаю одну и ту же историю: разработчики наивно полагаются на сборщик мусора, как на волшебную палочку, которая решит все проблемы с памятью. Да,. . .	Повышаем производительность игры на Unity 6 с GPU Resident Drawer GameUnited 11.06.2025 Недавно копался в новых фичах Unity 6 и наткнулся на GPU Resident Drawer - штуку, которая заставила меня присвистнуть от удивления. По сути, это внутренний механизм рендеринга, который автоматически. . .	Множества в Python py-thonny 11.06.2025 В Python существует множество структур данных, но иногда я сталкиваюсь с задачами, где ни списки, ни словари не дают оптимального решения. Часто это происходит, когда мне нужно быстро проверять. . .	Работа с ccache/sccache в рамках C++ Loafer 11.06.2025 Утилиты ccache и sccache занимаются тем, что кешируют промежуточные результаты компиляции, таким образом ускоряя последующие компиляции проекта. Это означает, что если проект будет компилироваться. . .

@sau 2769 / 2069 / 386 Регистрация: 22.07.2011 Сообщений: 7,813
	10.11.2016, 01:17
	Тут дело не в asp net , это некоторые браузеры при кросс-доменных запросах делают предварительные проверочные запросы. - из соображений безопасности , на что сервер может отреагировать и дать запрет. если потребуется. В вашем случае , нужно просто разрешить данный тип запроса , на уровне веб.апи это делается через config.EnableCors из пакета Microsoft.AspNet.WebApi.Cors П.С Если скрипт запроса исполняется в том же домене , не нужно указывать полный адрес , достаточно указать относительный путь. 1

@naximuz 0 / 0 / 1 Регистрация: 23.10.2009 Сообщений: 22
	10.11.2016, 08:21 [ТС]
	Действительно, ответ был прост. Спасибо за подсказку, перепроверил с предварительными методами, GET и POST работают корректно. Успехов в программировании! 0

Опции темы