Включение CORS в веб-API ASP.NET Core 2.1

Я пишу приложение на ASP .NET Core 2.1 Web API и React. У меня есть сервер на localhost: 5000 и мой клиент на localhost: 3000. Я хотел отправить почтовый запрос с помощью axios, но в консоли браузера я вижу ошибку:

OPTIONS https://localhost:5001/api/auth/login 0 ()
Uncaught (in promise) Error: Network Error
at createError (createError.js:16)
at XMLHttpRequest.handleError (xhr.js:87)

В своем веб-API я пытаюсь добавить CORS, но, похоже, это не работает. Я добавить:

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors();
    services.AddMvc();
    ...
}

И:

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors(options =>
        options
        .AllowAnyOrigin()
        .AllowAnyMethod()
        .AllowAnyHeader()
        .AllowCredentials());
    ...
    app.UseMvc();
}

И это мой почтовый запрос:

const response = await axios({
        method: 'post',
        url: 'http://localhost:5000/api/auth/login',

        data: {
            userName: this.state.controls.login.value,
            password: this.state.controls.password.value
        }
    });

Консоль сервера после запроса:

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
      Request starting HTTP/1.1 OPTIONS http://localhost:5000/api/auth/login
info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]
      Policy execution successful.
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
      Request finished in 4.253ms 204
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
      Request starting HTTP/1.1 POST http://localhost:5000/api/auth/login application/json;charset=UTF-8 52
info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]
      Policy execution successful.
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
      Request finished in 2.1805ms 307
info: Microsoft.AspNetCore.Server.Kestrel[32]
      Connection id "0HLG4CH3JIV16", Request id "0HLG4CH3JIV16:00000002": the application completed without reading the entire request body.

Когда пользуюсь Postman, все нормально. Я получаю json с токеном с сервера.

если вам не нужны COR при развертывании, вы можете настроить прокси только для своей среды разработки. что вы используете в качестве веб-сервера для разработчиков?

ATerry 17.08.2018 19:33

Я использую сервер разработки, встроенный в приложение create-response-app. Как я могу настроить прокси?

MuchaJusia 17.08.2018 19:36

Хорошо, я установил прокси в package.json и изменил свой URL-адрес в axios на «/ api / auth / login», но в консоли я все еще вижу то же самое. Я не знаю, почему он перенаправляет меня на https и порт 5001, даже если я установил http и порт 5000 в прокси

MuchaJusia 17.08.2018 19:47

Даже если я установил прокси в конфигурации axios, у меня все равно будет та же проблема, ничего не изменится

MuchaJusia 17.08.2018 20:03

это может помочь. github.com/facebook/create-react-app/issues/800. извините, я не особо беспокоюсь о реакции. Я получил это для работы в angular, но это другая оболочка для express. удачи

ATerry 17.08.2018 20:12

@MuchaJusia Вы добавили атрибут EnableCors в свой класс AuthController?

Mohsin Mehmood 17.08.2018 20:13

@MohsinMehmood Да. Но в консоли я вижу, что «Выполнение политики выполнено успешно», так что, может быть, это не проблема с cors? Почему мое приложение может быть заполнено, не прочитав все тело запроса?

MuchaJusia 17.08.2018 21:06
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
1
7
4 507
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Хорошо, я решил свою проблему. Я просто не знал, что мне нужно удалить «app.UseHttpsRedirection ();».

Спасибо большое. Потратил весь день на поиск этого решения

Alf Moh 07.03.2020 20:31

Другие вопросы по теме