ASP.NET Core 3.1 SignalR：方法未调用

如何解决ASP.NET Core 3.1 SignalR：方法未调用

我有一个应用程序，该应用程序在前端是React，在后端是nodejs。我决定使用SignalR在ASP.NET Core 3.1中重写后端。我是ASP.NET Core 3.1和SignalR的新手，因此我很难确定问题的原因。

问题是我从前端调用的集线器方法没有被命中。几天前，我遵循了the example，并设法调用了hub方法，但是由于引入了一些功能，例如JWT身份验证as described here和MongoDB，该方法现在没有被调用。我不知道为什么！

考虑到浏览器中的日志输出，连接似乎成功。

我的startup.cs看起来像这样：

namespace MpApp.API
{
  public class Startup
  {
    public Startup(IConfiguration configuration)
    {
      Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
      services.AddCors(options =>
      {
        options.AddPolicy("AllowSpecificOrigin",builder =>
          {
            builder
              .WithOrigins("http://localhost:3000","http://localhost:3010")
              .AllowAnyMethod()
              .AllowAnyHeader()
              .AllowCredentials();
          });
      });

      var domain = $"https://{Configuration["Auth0:Domain"]}/";
      services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
        .AddJwtBearer(options =>
        {
          options.Authority = domain;
          options.Audience = Configuration["Auth0:Audience"];

          options.Events = new JwtBearerEvents
          {
            OnMessageReceived = context =>
            {
              var accessToken = context.Request.Query["access_token"];

              // If the request is for our hub...
              var path = context.HttpContext.Request.Path;
              if (!string.IsNullOrEmpty(accessToken) &&
                  (path.StartsWithSegments("/chathub")))
              {
                // Read the token out of the query string
                context.Token = accessToken;
              }

              return Task.CompletedTask;
            }
          };
        });

      services.AddAuthorization(options =>
      {
        options.AddPolicy("read:messages",policy => policy.Requirements.Add(new HasScopeRequirement("read:messages",domain)));
      });

      services.AddControllers();

      services.AddSignalR();

      // Register the scope authorization handler
      services.AddSingleton<IAuthorizationHandler,HasScopeHandler>();

      Debug.WriteLine("===== about to init config =====");
      services.Configure<DatabaseSettings>(
        Configuration.GetSection(nameof(DatabaseSettings)));

      services.AddSingleton<IDatabaseSettings>(sp =>
        sp.GetRequiredService<IOptions<DatabaseSettings>>().Value);

      services.AddSingleton<IBaseService,BaseService>();

      services.AddSingleton<CollectionService<Profile>>();
      services.AddSingleton<CollectionService<User>>();
    }

    // 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.UseHsts();
      }

      app.UseHttpsRedirection();

      app.UseRouting();

      app.UseCors("AllowSpecificOrigin");

      app.UseAuthentication();
      app.UseAuthorization();

      app.UseEndpoints(endpoints =>
      {
        endpoints.MapControllers();
        endpoints.MapHub<ChatHub>("/chathub");
      });
    }
  }
}

我的ChatHub.cs看起来像这样：

namespace MyApp.API.Hubs
{
  public class ChatHub : Hub
  {
    protected CollectionService<Profile> _profileService;
    protected CollectionService<User> _userService;

    public ChatHub(CollectionService<Profile> profileService,CollectionService<User> userService)
    {
     // This constructor is being called
      _profileService = profileService;
      _userService = userService;
    }

    [Authorize]
    public async Task UpdateProfile()
    {
      // I have put a breakpoint here but it is not being hit
      await Clients.All.SendAsync("Test");
    }
  }
}

React前端似乎正在正确等待连接以及正确调用该方法，但无法正常工作！

我的React提供程序的相关代码如下：

useEffect(() => {
  (async () => {
    if (isAuthenticated) {
      const accessToken = await getAccessTokenSilently();

      const connection = new signalR.HubConnectionBuilder()
        .configureLogging(signalR.LogLevel.Debug)
        .withUrl('http://localhost:3010/chathub',{accessTokenFactory: () => accessToken})
        .build();

      await connection.start();
      setConnected(true);
    }
    // eslint-disable-next-line
  })()
},[isAuthenticated]);

useEffect(() => {
  (async () => {
    if(connected && user) {
      // this code is being hit,but the method on the back end is not
      await connection?.send('UpdateProfile');
    }
  })()
},[connected,user])

有人知道为什么会这样吗？我在调用中尝试了小写的方法名称，但这无济于事。

解决方法

将[Authorize]属性放在您的ChatHub类的顶部。如果您在启动时未配置任何默认授权方案，则需要包括这样的授权方案

    [Authorize(AuthenticationSchemes = JwtBearerDefaults.AuthenticationScheme)]
    public class ChatHub: Hub 
    {
          //...
    }

*注意：当我使用SignalR时，我将DTO转换为JSON String并将它们传递给服务器，也许您需要对具有参数的函数执行此操作。 像这样：

     public void FunctionName(string  dtoString)
     {
        
        var dto = JsonConvert.DeserializeObject<MyObjectDto>(dtoString);
        //Do something with my DTO
        
      }

，然后将对象作为JSON String传递回客户端

    var resultString = JsonConvert.SerializeObject(ResultObject,new 
    JsonSerializerSettings
            {
                ContractResolver = new CamelCasePropertyNamesContractResolver()
            });
    Clients.Caller.SendAsync("ClientFunction",resultString  );

SignalR中的令牌是在查询中发送的，因此您需要从查询中读取它们并将它们放在标题上。

  services.AddAuthentication()
        .AddJwtBearer(options =>
        {
            options.RequireHttpsMetadata = false;
            options.SaveToken = true;
            options.TokenValidationParameters = new TokenValidationParameters
            {
                ValidateAudience = false,ValidIssuer = [Issuer Site],IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes([YOUR SECRET KEY STRING]))
            };
            options.Events = new JwtBearerEvents
            {
                OnMessageReceived = context =>
                {
                    var path = context.Request.Path;
                    var accessToken = context.Request.Query["access_token"];
                    if (!string.IsNullOrEmpty(accessToken) && path.StartsWithSegments("/chathub"))
                    {
                        
                        context.Request.Headers.Add("Authorization",new[] { $"Bearer {accessToken}" });
                    }
                    return Task.CompletedTask;
                }
            };
        });

如果您有任何麻烦，请告诉我。 希望它能起作用！