刷新页面时连接握手失败和 500 错误 - 使用 Angular 和 .Net Core 的 Abp 为零

Question

当我登录应用程序时，angular 将 ulr 更改为 https://baseurl/app/home 并且主页正确呈现。如果我刷新页面，我会收到服务器 (500) 错误。如果我删除地址栏中的 /app/home 部分并刷新，页面会重新加载而不会出现问题。

在服务器端的日志中，我发现： 失败：Microsoft.AspNetCore.SignalR.HubConnectionContext[5] 连接握手失败。

我在两个不同的服务器上运行 Angular 客户端和 .net 核心应用程序，并且 CORS 设置正确，客户端应用程序能够连接到 api。该应用程序运行良好，除非我刷新带有角度路线的页面。

当我在我的开发机器上本地运行应用程序时，不会出现此问题。

我没有更改原始 Abp 零模板中的任何路由或信号器相关代码。

在服务器上：

• .NetCore 2.2

• Abp 零 v 4.8

  services.AddSignalR() 在 startup.cs 文件中被调用，

  app.UseSignalR(路由 => { routes.MapHub("/signalr"); });

也从 Configuration 方法在 startup.cs 文件中调用。所有这些都是标准的模板代码。

在 Angular 客户端中：

• @aspnet/signalr v 1.1.4

在app.component.ts文件的OnInit中调用initSignalR()的未改变的SignalRAspNetCoreHelper：

import { AppConsts } from '@shared/AppConsts';
import { UtilsService } from '@abp/utils/utils.service';

export class SignalRAspNetCoreHelper {
    static initSignalR(): void {

        const encryptedAuthToken = new UtilsService().getCookieValue(AppConsts.authorization.encrptedAuthTokenName);

        abp.signalr = {
            autoConnect: true,
            connect: undefined,
            hubs: undefined,
            qs: AppConsts.authorization.encrptedAuthTokenName + '=' + encodeURIComponent(encryptedAuthToken),
            remoteServiceBaseUrl: AppConsts.remoteServiceBaseUrl,
            startConnection: undefined,
            url: '/signalr'
        };

        jQuery.getScript(AppConsts.appBaseUrl + '/assets/abp/abp.signalr-client.js');
    }
}

app-routing.module.ts 也没有改变：

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { AppRouteGuard } from '@shared/auth/auth-route-guard';
import { HomeComponent } from './home/home.component';
import { AboutComponent } from './about/about.component';
import { UsersComponent } from './users/users.component';
import { TenantsComponent } from './tenants/tenants.component';
import { RolesComponent } from 'app/roles/roles.component';
import { ChangePasswordComponent } from './users/change-password/change-password.component';

@NgModule({
    imports: [
        RouterModule.forChild([
            {
                path: '',
                component: AppComponent,
                children: [
                    { path: 'home', component: HomeComponent,  canActivate: [AppRouteGuard] },
                    { path: 'users', component: UsersComponent, data: { permission: 'Pages.Users' }, canActivate: [AppRouteGuard] },
                    { path: 'roles', component: RolesComponent, data: { permission: 'Pages.Roles' }, canActivate: [AppRouteGuard] },
                    { path: 'tenants', component: TenantsComponent, data: { permission: 'Pages.Tenants' }, canActivate: [AppRouteGuard] },
                    { path: 'about', component: AboutComponent },
                    { path: 'update-password', component: ChangePasswordComponent }
                ]
            }
        ])
    ],
    exports: [RouterModule]
})
export class AppRoutingModule { }

root-routing.module.ts（同样不变）：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
    { path: '', redirectTo: '/app/home', pathMatch: 'full' },
    {
        path: 'account',
        loadChildren: 'account/account.module#AccountModule', // Lazy load account module
        data: { preload: true }
    },
    {
        path: 'app',
        loadChildren: 'app/app.module#AppModule', // Lazy load account module
        data: { preload: true }
    }
];

@NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule],
    providers: []

})
export class RootRoutingModule { }

关于什么是错的任何想法？由于我没有更改任何内容，我想知道问题是否与环境/配置有关？

Answer 1

如果有人偶然发现这个问题：

当我在我的开发机器上本地运行应用程序时，不会出现此问题。

问题与生产服务器有关，请求未正确转发到您的 Angular 应用程序

IIS

基本上你需要安装url-rewrite，然后为前端站点web.config配置一个web.config文件link 1link 2

阿帕奇

link 1link 2