天天看点

.Net Core通过Signalr搭建WebIM,跨域问题处理

1.我们都知道.net core的跨域问题处理,此处我们简单描述下,我们可以通过自定义中间件CorsSetup.cs来实现自定义多个域名之前的跨域访问,代码如下:

/// <summary>
    /// Cors 跨域 启动服务
    /// </summary>
    public static class CorsSetup
    {
        public static void AddCorsSetup(this IServiceCollection services)
        {
            if (services == null) throw new ArgumentNullException(nameof(services));

            services.AddCors(c =>
            {
                c.AddPolicy("LimitRequests", policy =>
                {
                    // 支持多个域名端口,注意端口号后不要带/斜杆:比如localhost:8000/,是错的
                    // 注意,http://127.0.0.1:1818 和 http://localhost:1818 是不一样的,尽量写两个
                    policy
                    .WithOrigins(Appsettings.app(new string[] { "Startup", "Cors", "IPs" }).Split(','))
                    .AllowAnyHeader()//Ensures that the policy allows any header.
                    .SetIsOriginAllowed(str => true)
                    .AllowCredentials()
                    .AllowAnyMethod();
                });
            });
        }
    }
           

2.在Startup.cs的Configure方法中进行调用上述自定义中间件

app.UseCors("LimitRequests");
           

3.这样我们的.Net Core的跨域问题就轻松解决了,然后部署、上线,你会突然发现你的signalr是调不通的(如果是跨域调用的话),原因是:signalr的跨域跟.net core的跨域,它不是一回事,因为signalr实际就是WebSocket,CORS 提供的保护不适用于 WebSocket,所以就会出现:跨域请求接口OK,但是singnlar就会报错、无响应等,这个时候我们需要单独对Signalr进行跨域配置,代码如下:

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

                endpoints.MapHub<ChatHub>("/api/chatHub/signalr")
                .RequireCors(policy =>
                {
                    // 支持多个域名端口,注意端口号后不要带/斜杆:比如localhost:8000/,是错的
                    // 注意,http://127.0.0.1:1818 和 http://localhost:1818 是不一样的,尽量写两个
                    policy
                    .WithOrigins(Appsettings.app(new string[] { "Startup", "Cors", "IPs" }).Split(','))
                    .AllowAnyHeader()//Ensures that the policy allows any header.
                    .SetIsOriginAllowed(str => true)
                    .AllowCredentials()
                    .AllowAnyMethod();
                });
            });
           

4.此处提醒下:我们调用自定义Cors的时候的顺序,一定是在app.UseRouting()和app.UseAuthorization()中间,即:

.Net Core通过Signalr搭建WebIM,跨域问题处理

如果顺序不是这样的话,那么可能会出现400的请求错误

.Net Core通过Signalr搭建WebIM,跨域问题处理
.Net Core通过Signalr搭建WebIM,跨域问题处理

5.补充:

ASP.NET Core 中的安全注意事项 SignalR

(CORS) 启用跨域请求 ASP.NET Core

ASP.NET Core 中间件顺序