Включить предпечатную проверку CORS между C# и Angular

Question

Я пытаюсь заставить CORS работать для запроса, который требует предварительной проверки. В этом случае я делаю POST-запрос к бэкэнду с дополнительным заголовком.

Angular:

  let myHeaders = new HttpHeaders();
    myHeaders = myHeaders.append('Content-Type', 'application/json');
    return this.http.post<UserOrder>(`${this.apiURL}/Order/PlaceOrder`, JSON.stringify(payload), {headers : myHeaders});   //email); 

C# API:

[HttpPost("PlaceOrder")]
        public GenericResponse PlaceOrder(UserOrderInsertModel userOrder) 
        {
            return _orderProvider.PlaceOrder(new UserOrder());
        }

Из-за предварительной проверки сначала выполняется запрос OPTIONS. Когда я не определяю отдельную опцию-конечную точку в бэкэнде, я получаю метод 405 Not Allowed. Это заставило меня подумать, что мне нужна отдельная конечная точка опций в моем бэк-энде поверх пост-конечной точки.

[HttpOptions("PlaceOrder")]
        public ActionResult PlaceOrderOptions(UserOrderInsertModel userOrder)
        {
            return Ok();
        }

После добавления этого я столкнулся с 415 неподдерживаемым типом носителя (при вызове параметров). Вероятно, это связано с тем, что заголовок Content-Type не поддерживается для запроса HttpOptions.

Мне кажется, что конечная точка дополнительных опций вообще не должна быть необходимой. В настоящее время я использую промежуточное программное обеспечение CORS:

httpContext.Response.Headers.Add("Access-Control-Allow-Origin", "http://localhost:4200");
httpContext.Response.Headers.Add("Access-Control-Allow-Methods", "GET, POST, OPTIONS");  
httpContext.Response.Headers.Add("Access-Control-Allow-Headers", "*");
httpContext.Response.Headers.Add("Access-Control-Allow-Credentials", "true");

Дополнительная информация: CORS в целом уже работает. Межсайтовый скриптинг с GET-запросом и заголовком Access-Control-Allow-Origin прошел хорошо. Просто я не могу заставить работать комбо POST / OPTIONS.

Редактировать: в Startup.cs я впервые попытался использовать app.UseCors () следующим образом:

app.UseCors();
    options => options.WithOrigins("http://localhost").AllowAnyMethod()
);

К сожалению, это не сработало, поэтому я прибег к установке промежуточного программного обеспечения, как описано выше.

Любая помощь будет принята с благодарностью!

Answer 1

Хорошо, всем большое спасибо. Проблема, скорее всего, была в промежуточном программном обеспечении, которое я использовал. Это был обходной путь, который я добавил, потому что UseCors () изначально не работал. Вероятно, это было потому, что я изначально не использовал app.AddCors (). Без специального промежуточного программного обеспечения все становится намного проще!

Answer 2

Беглый взгляд на документацию прояснит несколько вещей. Я делюсь несколькими выдержками ниже

Из-за предварительной проверки он сначала делает OPTIONS-запрос. Когда я не определяю отдельную опцию-конечную точку в бэкэнде, я получаю метод 405 Not Allowed. Это заставило меня подумать, что мне нужна отдельная конечная точка опций в моем бэк-энде поверх пост-конечной точки.

Предварительный запрос

Для некоторых запросов CORS браузер отправляет дополнительный запрос OPTIONS перед выполнением фактического запроса. Этот запрос называется предполетным запросом. Браузер может пропустить предварительный запрос, если выполняются все следующие условия

• Метод запроса: GET, HEAD или POST.
• Приложение не ' • установить заголовки запроса, отличные от Accept, Accept-Language, Content-Language, Content-Type или Last-Event-ID.
• Заголовок Content-Type, если установлен, имеет одно из следующих значений: application / x- www-form-urlencoded multipart / text-data data / plain

Мне кажется, что конечная точка дополнительных параметров вообще не нужна.

Кроме вас используют CORS с маршрутизацией конечной точки, AS PNET Ядро должно отвечать на соответствующий запрос предварительной проверки, когда ядро ​​включено при запуске.

Условие для Automati c предварительная проверка

Когда применяется политика CORS либо:

• Глобально, вызывая app.UseCors в Startup.Configure.
• Использование атрибута [EnableCors].

ASP. NET Ядро отвечает на предварительный запрос OPTIONS.

Включение CORS для каждой конечной точки База, использующая RequireCors, в настоящее время не поддерживает автоматические c предварительные запросы.

Включить Cors при запуске

В службе конфигурации

 public void ConfigureServices(IServiceCollection services)
    {
        .
        //other codes
        .
    services.AddCors(options =>
        {
            options.AddDefaultPolicy(
                builder => //check corsbuilder for additonal config
                {
                    builder.WithOrigins("http://example.com",
                                        "http://www.contoso.com;
                });
        });
        .
        //other codes
        .
    }

и в методе настройки

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        .
        //Other codes
        .

        app.UseCors();

        .
        //Other codes
        .
    }

полная документация здесь для 3.0 https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-3.0#ecors

Answer 3

Обязательно вызывайте UseCors () перед UseEndpoints (). Еще один совет: если у вас есть учетные данные, подстановочный знак не работает должным образом. https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Methods