Spartacus出现“Cannot get base site config”错误如何跳转至404页

该错误是Spartacus初始化阶段匹配baseSite规则失败后抛出的未捕获异常，会默认中断前端渲染逻辑导致白屏，以下是可落地的处理方案：

方案1：前端重写BaseSiteInitializer拦截异常 #

• 自定义服务继承Spartacus原生的BaseSiteInitializer，捕获baseSite匹配失败的错误后直接跳转404：

import { BaseSiteInitializer, BaseSiteService, OccConfig, RoutingConfig } from '@spartacus/core';
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { catchError } from 'rxjs/operators';
import { of } from 'rxjs';

@Injectable()
export class CustomBaseSiteInitializer extends BaseSiteInitializer {
  constructor(
    baseSiteService: BaseSiteService,
    config: OccConfig,
    private router: Router,
    private routingConfig: RoutingConfig
  ) {
    super(baseSiteService, config);
  }

  initialize(): void {
    this.baseSiteService
      .initialize()
      .pipe(
        catchError((err) => {
          if (err.message.includes('Cannot get base site config')) {
            // 读取配置的404路由，没有配置的话可以直接写死'/404'
            const notFoundPath = this.routingConfig.routes?.['notFound']?.paths?.[0] || '/404';
            this.router.navigateByUrl(notFoundPath);
          }
          return of(void 0);
        })
      )
      .subscribe();
  }
}

• 在根模块的providers配置中替换原生的BaseSiteInitializer服务：

@NgModule({
  // ... 其余配置
  providers: [
    {
      provide: BaseSiteInitializer,
      useClass: CustomBaseSiteInitializer
    }
  ]
})
export class AppModule {}

方案2：SSR场景服务端预校验 #

如果项目启用了服务端渲染，可以在NodeJS服务层提前校验请求URL是否匹配合法的baseSite规则，匹配失败直接返回302重定向到404页面，无需进入前端渲染逻辑，性能表现更好。

注意事项 #

• 提前配置好项目的404路由和对应页面组件，避免跳转时再次出现路由匹配错误
• 如果你的baseSite是通过URL参数传递而非路径前缀携带，需要自行调整错误匹配逻辑适配你项目的baseSite解析规则

内容的提问来源于stack exchange，提问作者pok