由于升级到 Angular 9 Signalr 不起作用

Question

我有一个使用 signalR 的角度应用程序。它托管在 .NET Core 3.1 应用程序中。升级到 Angular 9 后，signalR 不再有效。在 Angular 8 中一切正常。自更新以来，我一直收到类似的错误

404 错误：无法完成与服务器的协商

无法启动连接

我正在使用 MessagePackHubProtocol。在package.json文件中，我有以下包：

"@microsoft/signalr": "3.1.2",
"@microsoft/signalr-protocol-msgpack":"3.1.2"

在 .NET 核心我有包：

Microsoft.AspNetCore.SignalR.Common 3.1.2 Microsoft.AspNetCore.SignalR.Protocols.MessagePack 3.1.2

我使用的 Typescript 版本是 v3.7.5。我启用了 SSL。

---

我尝试按照这篇文章中的说明添加 CORS，并且还尝试将以下选项添加到我的客户端应用程序中。

"@microsoft/signalr": "3.1.2",
"@microsoft/signalr-protocol-msgpack":"3.1.2"

不幸的是，两者都不起作用。

启动.cs：

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.ViewFeatures;
using Microsoft.AspNetCore.Server.IISIntegration;
using Microsoft.AspNetCore.SpaServices.AngularCli;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.DependencyInjection.Extensions;
using Microsoft.Extensions.FileProviders;
using Microsoft.Extensions.Hosting;
using System.IO;


public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public static IConfiguration Configuration
    {
        get; set;
    }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.Configure<AppConfig>(options =>
        {
            Configuration.GetSection("AppConfig").Bind(options);
        });

        // In production, the Angular files will be served from this directory
        services.AddSpaStaticFiles(configuration =>
        {
            configuration.RootPath = "ClientApp/dist";
        });

        services.TryAddSingleton<IHttpContextAccessor, HttpContextAccessor>();

        services.AddAuthentication(IISDefaults.AuthenticationScheme);

        services.Configure<CookiePolicyOptions>(options =>
        {
            // This lambda determines whether user consent for non-essential cookies is needed for a given request.
            options.CheckConsentNeeded = context => true;
            options.MinimumSameSitePolicy = SameSiteMode.None;
        });


        services.AddSingleton<ITempDataProvider, CookieTempDataProvider>();

        services.AddSignalR(o =>
        {
            o.EnableDetailedErrors = true;
            o.MaximumReceiveMessageSize = 1000000;
        }).AddMessagePackProtocol();

        services.AddControllersWithViews()
                        .SetCompatibilityVersion(CompatibilityVersion.Version_3_0)
                        .AddJsonOptions(options =>
                        {
                            options.JsonSerializerOptions.PropertyNamingPolicy = null;
                            options.JsonSerializerOptions.DictionaryKeyPolicy = null;
                        });

        services.AddRazorPages();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if(env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Error");
            // 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.UseHttpContext();
        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseStaticFiles(new StaticFileOptions()
        {
            FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), @"Uploads")),
            RequestPath = new PathString("/Uploads")
        });

        app.Use(async (context, next) =>
        {
            context.Response.Headers.Remove("X-XSS-Protection");
            context.Response.Headers.Add("X-Xss-Protection", "1");
            context.Response.Headers.Remove("X-Frame-Options");
            context.Response.Headers.Add("X-Frame-Options", "DENY");
            context.Response.Headers.Remove("Referrer-Policy");
            context.Response.Headers.Add("Referrer-Policy", "no-referrer");
            context.Response.Headers.Remove("X-Content-Type-Options");
            context.Response.Headers.Add("X-Content-Type-Options", "nosniff");
            //context.Response.Headers.Remove("Content-Security-Policy");
            //context.Response.Headers.Add(
            //    "Content-Security-Policy",
            //    "default-src 'self'; " +
            //    "img-src 'self' myblobacc.blob.core.windows.net; " +
            //    "font-src 'self'; " +
            //    "style-src 'self'; " +
            //    "script-src 'self' 'nonce-KIBdfgEKjb34ueiw567bfkshbvfi4KhtIUE3IWF' 'nonce-rewgljnOIBU3iu2btli4tbllwwe'; " +
            //    "frame-src 'self';" +
            //    "connect-src 'self';");

            await next();
        });


        if(!env.IsDevelopment())
        {
            app.UseSpaStaticFiles();
        }


        app.UseRouting();

        app.UseAuthentication();

        WebSocketOptions webSocketOptions = new WebSocketOptions();
        webSocketOptions.AllowedOrigins.Add("*");

        app.UseWebSockets(webSocketOptions);

        app.UseEndpoints(endpoints =>
       {
           endpoints.MapControllers();
           endpoints.MapHub<AppHub>("/appHub");

           endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller}/{action=Index}/{id?}");
       });

        app.UseSpa(spa =>
        {
            // To learn more about options for serving an Angular SPA from ASP.NET Core,
            // see https://go.microsoft.com/fwlink/?linkid=864501

            spa.Options.SourcePath = "ClientApp";

            if(env.IsDevelopment())
            {
                spa.UseAngularCliServer(npmScript: "start");
            }
        });

        app.UseCookiePolicy();

    }










}

我的角度信号R服务：

Microsoft.AspNetCore.SignalR.Common 3.1.2 Microsoft.AspNetCore.SignalR.Protocols.MessagePack 3.1.2

我的 package.json：

{
  skipNegotiation: true,
  transport: signalR.HttpTransportType.WebSockets
}

Answer 1

我设法找到问题所在并让 signalR 再次工作。在我的 tsconfig.json 文件中，“compilerOptions”部分有以下值：

"target": "es2015"

我改为：

target": "es5"

这更像是一种解决方法，因为我想使用 es2015，但目前，一切正常，我很高兴。如果有人知道如何让它与 es2015 一起工作，请告诉我。