SAP Spartacus 404 Not found页面的显示机制 - canActivateNotFoundPage

2024-05-11 05:41:55

这个方法位于类CmsPageGuardService内。

当我们请求一个实际并不存在的page时，

因为1这个path对应的route configuration里的protected字段为undefined，所以不算是protected route，因此canActivate返回true.

进入this.routingService.getNextPageContext方法。

该方法从ngrx store里用SELECT取出Observable：

此时取出的page context已经不是homepage，而是1了：

试图取这个pageLabelOrId为1的page，当然取不到数据：

因此进入this.service.canActivateNotFoundPage:

而我在浏览器地址栏里输入1之后，page context何时改变的呢？

答案是在ngrx-router.store.js里，调用537行我们自己实现的serializer, 将包含了electronics-spa/en/USD/1的RouterStateSnapshot，序列化成一个新的nextRouterState：

新的page context 对象在此处生成：

然后通过serializer返回给调用者，dispatch给ngrx store：

538行执行完毕之后，再进入我们的router.reducer.ts:

更多Jerry的原创文章，尽在：“汪子熙”:

不正常情况下的SAP Spartacus 404 Not found页面显示：

正常情况下的SAP Spartacus 404 Not found页面显示：

SAP Spartacus 404 Not found页面的显示机制 - canActivateNotFoundPage相关推荐

如何让SAP Spartacus的非英语页面正常显示
如下图所示,当修改Spartacus的语言成德语时,我们在界面上看到很多用大括号包裹起来的占位符,这些占位符是Spartacus internationalization(i18n)支持的resour ...
SAP Spartacus PageLayoutComponent 如何知道自己应该显示哪些具体内容
我们以前介绍过,经过 SAP Spartacus 路由配置后的 routes 数组,其 route 数据结构的 Component 属性,清一色指向 generic 的 PageLayoutCompo ...
SAP Spartacus not found的页面处理机制
当我们跳转到一个SAP Spartacus里实际并不存在的页面时: 首先会将url里的值比如1,作为pageLabelOrID的参数值,去Commerce Cloud后台读取对应的content pa ...
SAP Spartacus split view控制同屏显示最大视图数的配置
位于文件_split-view.scss内: 修改–cx-max-views的值.改为1的效果,同屏只允许最多一个view处于激活状态: 修改成3: 同屏最多显示3个视图: 更多Jerry的原创文章, ...
SAP Spartacus Org Unit明细页面的工具栏按钮设计
工具栏上肉眼可见两个按钮:Edit和Disable 其中Edit按钮通过a标签实现: 而disable通过自定义的cx-org-toggle-status实现: 从最后渲染出的html页面里能看出,c ...
SAP Spartacus Org Unit明细页面的设计原理
该页面分三部分组成. 其中蓝色和绿色两个区域的实现如下:两个section标签页: section是HTML标准的标签之一,每个标签通过h1到h6不等的heading标签标识. 运行时渲染的HTML原 ...
SAP Spartacus Organization Unit User页面的实现层级结构
右边这个页面的实现细节: 层级结构如下: (1) cx-org-unit-user-list, Component为UnitUserListComponent: (2) cx-org-sub-list ...
SAP Spartacus的用户登录页面设计
点击sign in之后,先取token: https://spartacus-dev0.eastus.cloudapp.azure.com:9002/authorizationserver/oauth ...
SAP Spartacus的自定义静态页面
新建一个StaticRouteModule: import { CommonModule } from '@angular/common'; import { NgModule } from '@an ...

最新文章

热门文章