Проблема политики CORS с Angular 7 и ASP.NET core 2.2 с использованием SIGNAL R - PullRequest
0 голосов
/ 21 февраля 2019

Мой друг и я сталкиваемся с проблемой CORS с нашим API и угловым клиентом.Мы пытаемся установить связь, мы используем signalR, и клиент (Angular 7) регистрируется для получения сообщений от сервера (ASP .NET core 2.2).

В консоли браузера я получаю это сообщение:

Доступ к XMLHttpRequest в «https://ourEndpoint/CoordinatorHub/negotiate' от источника» http://localhost:4200' заблокировансогласно политике CORS: Ответ на запрос предварительной проверки не проходит проверку контроля доступа: значение заголовка «Access-Control-Allow-Origin» в ответе не должно быть подстановочным знаком «*», если режим учетных данных запроса «включить»,Режим учетных данных запросов, инициируемых XMLHttpRequest, контролируется атрибутом withCredentials.

Сторона сервера

Наш файл startup.cs выглядит следующим образом, мы следовали документам Microsoft

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors();
    services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
    services.AddDbContext<OneRoomContext>(options =>
            options.UseSqlServer(Configuration.GetConnectionString("OneRoomContext")));
    services.AddSignalR();
    // Register the Swagger services
    services.AddSwaggerDocument();
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseDeveloperExceptionPage();
    app.UseCors(builder =>
        builder.AllowAnyOrigin()
               .AllowAnyMethod()
               .AllowAnyHeader()
               .AllowCredentials());
    //if (env.IsDevelopment())
    //{
    //    app.UseDeveloperExceptionPage();
    //    app.UseCors(builder =>
    //        builder.AllowAnyOrigin()
    //               .AllowAnyMethod()
    //               .AllowAnyHeader());
    //}
    //else
    //{
    //    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    //    app.UseHsts();
    //}
    app.UseSignalR(route =>
    {
        route.MapHub<CoordinatorHub>("/CoordinatorHub");
    });
    app.UseHttpsRedirection();
    app.UseMvc();
    // Register the Swagger generator and the Swagger UI middlewares
    app.UseSwagger();
    app.UseSwaggerUi3();
}

И это наш контроллер:

using Microsoft.AspNetCore.SignalR;
using oneroom_api.Model;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace oneroom_api.SignalR
{
    public class CoordinatorHub : Hub
    {
        public Task SendNewUser(User user)
        {
            return Clients.All.SendAsync("GetNewUser", user);
        }
    }
}

Портал Azure: CORS разрешен * происхождение

Клиентская сторона

Вот как наш app.component.tsвыглядит так (ngOnInit)

Мы используем пакет @ aspnet / signalr

this.hubConnection = new signalR.HubConnectionBuilder()
    .withUrl(localStorage.getItem('endpoint') + '/CoordinatorHub')
    .build();

this.hubConnection.on('send', data => {
  console.log(data);
});

this.hubConnection.start().then(() => this.hubConnection.invoke('send', 'Hello'));

Как отключить режим учетных данных или где мне нужно предоставить статус withCredentials?

Спасибо заваше время и ответы

Ответы [ 2 ]

0 голосов
/ 27 февраля 2019

В основном проблема заключалась в том, что CORS на Azure переписал код в нашем файле startup.cs, в итоге мы удалили конфигурацию CORS на нашем портале Azure, и все работает.Мы использовали пакет signal R npm с angular, поскольку старый signalR-клиент устарел.

0 голосов
/ 21 февраля 2019

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

Значение заголовка 'Access-Control-Allow-Origin' в ответе mustне быть подстановочным знаком '*', когда режим учетных данных запроса 'include'.

Конечно, вы можете попытаться заставить SignalR прекратить делать запрос, который требует от вашего API отправки Access-Control-Allow-Credentials заголовок, в зависимости от того, как вы собираетесь обрабатывать аутентификацию (куки или токен на предъявителя?).Однако это намного сложнее, чем простое расширение списка «разрешенных источников».Кроме того, вам действительно следует избегать использования подстановочных знаков для источника, особенно в производственных системах.

Для локальной разработки достаточно добавить адрес вашего сервера разработки в список разрешенных источников.Список должен быть расширен для каждого адреса, по которому приложение должно быть доступно.

 app.UseCors(builder =>
    builder.WithOrigins("http://localhost:4200")
           .AllowAnyMethod()
           .AllowAnyHeader()
           .AllowCredentials());

В дополнение к изменениям кода необходимо удалить запись CORS с подстановочными знаками из конфигурации службы приложения Azure.В противном случае изменения не будут иметь никакого эффекта, поскольку заголовок CORS будет перезаписан Azure.

...