Я создаю .Net Web Api, который будет использоваться клиентом Angular 6, но по какой-то причине я не могу заставить его работать в моей среде разработки.
Я начал с чрезвычайно простого Web Api, который просто ничего не делает, но возвращает строку (с обменом данными между внешним и внутренним тестированием):
// GET: api/Login
public IEnumerable<string> Get()
{
return new string[] { "Now it works!" };
}
// POST: api/Login
public void Post([FromBody]string value)
{
string strTest = "I'm doing just nothing";
}
, а затем в моем приложении Angular 6 есть метод со следующим пост-запросом:
return this.http.post<any>(`http://localhost:9810/api/Login`, { username, password })
.pipe(map(user => {
// login successful if there's a jwt token in the response
if (user && user.token) {
// store user details and jwt token in local storage to keep user logged in between page refreshes
localStorage.setItem('currentUser', JSON.stringify(user));
}
return user;
}));
В моих первых попытках все мои ответы терпели неудачу с ответом:
zone.js: 2969 ВАРИАНТЫ http://localhost:9810/api/Login 405 (метод не разрешен)
login: 1 Не удалось загрузить http://localhost:9810/api/Login: Ответ на запрос предварительной проверки не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin». Исходный код 'http://localhost:4200' поэтому не допускается.
Итак, после исследования я добавил поддержку CORS в свой проект WebApi .Net следующим образом:
1) Установленные пакеты Nuget:
Microsoft.AspNet.WebApi.Cors
Microsoft.AspNet.Cors
2) В методе регистрации WebApiConfig:
var cors = new EnableCorsAttribute("http://localhost:4200", "*", "*");
// or var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
3) В качестве альтернативы 2) в заголовке класса контроллера Api:
[EnableCors(origins: "http://localhost:4200", headers: "*", methods: "*")]
Но, похоже, ни один из них не работает, запрос всегда завершается с ошибкой, описанной выше в консоли браузера.
Я попытался создать самостоятельно принимающий WebApi прослушивающий http-вызовы на http://localhost:9000, а также мою последнюю попытку публикации WebApi на моем локальном сервере Windows 10 IIS с портом 9810.
Если я получу доступ к URL-адресу в браузере следующим образом: http://localhost/api/Login", тогда строка будет возвращена следующим образом:
<ArrayOfstring xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.microsoft.com/2003/10/Serialization/Arrays">
<string>Now it works!</string>
</ArrayOfstring>
и в консоли не отображается ошибка, но до тех пор, пока я пытаюсь выполнить запрос по Angular (порт по умолчанию 4200), запрос завершается с ошибкой CORS.
Я застрял. Если я не смогу заставить его работать с Angular, я не смогу делать отладку и тестирование.
Спасибо.
Редактировать 1: добавлена информация о вкладке сети Chrome.
Общее:
URL запроса: http://localhost:9000/api/Login
Способ запроса: ВАРИАНТЫ
Код состояния: метод 405 не разрешен
Удаленный адрес: [:: 1]: 9000
Политика реферера: no-referer-when-downgrade
Заголовки ответа:
Разрешить: ПОЛУЧИТЬ, ПОСТ
Длина контента: 76
Тип контента: приложение / JSON; кодировка = UTF-8 * 1 068 *
Дата: среда, 29 августа 2018 10:32:36 GMT
Сервер: Microsoft-HTTPAPI / 2.0
Заголовки запроса:
Примите: /
Accept-Encoding: gzip, deflate, br
Accept-Language: es-ES, es; q = 0,9
Access-Control-Request-Headers: content-type
Метод запроса контроля доступа: POST
Подключение: keep-alive
Хост: localhost: 9000
Происхождение: http://localhost:4200
Пользователь-агент: Mozilla / 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit / 537,36 (KHTML, как Gecko) Chrome / 68.0.3440.106 Safari / 537.36