SAP 电商云 Spartacus UI Cart ID 的 local storage 存储

简介: SAP 电商云 Spartacus UI Cart ID 的 local storage 存储

IsStable:首先 false,然后 true

@NgModule()
export class CartPersistenceModule {
  static forRoot(): ModuleWithProviders<CartPersistenceModule> {
    return {
      ngModule: CartPersistenceModule,
      providers: [
        {
          provide: APP_INITIALIZER,
          useFactory: cartStatePersistenceFactory,
          deps: [MultiCartStatePersistenceService, ConfigInitializerService],
          multi: true,
        },

提供的函数在应用程序启动时注入并在应用程序初始化期间执行。 如果这些函数中的任何一个返回 Promise 或 Observable,则在 Promise 解决或 Observable 完成之前,初始化不会完成。


例如,我们可以创建一个加载语言数据或外部配置的工厂函数,并将该函数提供给 APP_INITIALIZER 令牌。 该函数在应用程序引导过程中执行,所需数据在启动时可用。


应用程序初始化时,调用 cartStatePersistenceFactory:


Angular 框架调用所有的 app initializer:

这个 init 需要返回一个 promise 对象:

toPromise 对象内会调用 subscriber 的 next 方法:

调用 cartStatePersistenceService.initSync()

cart 信息存储在 local storage 里:

从 local storage 里取出的数据:

生成 key:

SSR 模式下没有浏览器 storage:

取出浏览器 local storage 里存储的当前 active cart id:2007

也就是下图高亮的 cart id:

不同的 base site,其对应的 cart id 不一致。

得到 cart id 后,调用 onRead 方法:

首先 clear Cart 状态:

进入 scheduleMessage,即利用 store 进行 Action dispatch,很有可能是一个异步过程。

然而没有进入异步 schedule 的分支:

进入 scheduleMessage,即利用 store 进行 Action dispatch,很有可能是一个异步过程。

然而没有进入异步 schedule 的分支:

调用 Observer 的 next 方法:

重新计算 state,并且把结果保存:

computedStates = recomputeStates(computedStates, minInvalidatedStateIndex, reducer, committedState, actionsById, stagedActionIds, skippedActionIds, errorHandler, isPaused);
        monitorState = monitorReducer(monitorState, liftedAction);

前一个状态:

调用 reducer 计算下一个状态:

这就是 Spartacus 自己实现的 reducer 了:

export function reducer(
  state = initialState,
  action: CmsActions.LoadCmsPageDataSuccess
): EntityState<Page> {
  switch (action.type) {
    case CmsActions.LOAD_CMS_PAGE_DATA_SUCCESS: {
      const page: Page = action.payload;
      return { ...state, entities: { ...state.entities, [page.pageId]: page } };
    }
  }
  return state;
}

会依次执行很多对应的 reducer:

相关文章
|
12天前
|
监控 测试技术
SAP 电商云修改 Product Catalog Staged 版本数据后,同步到 online 版本的 UI 操作
SAP 电商云修改 Product Catalog Staged 版本数据后,同步到 online 版本的 UI 操作
20 3
|
12天前
|
监控 数据挖掘 定位技术
Spartacus 测试,后台修改 product price 数据后,添加到 Cart 时,会带出来最新的价格吗
Spartacus 测试,后台修改 product price 数据后,添加到 Cart 时,会带出来最新的价格吗
21 2
|
12天前
|
设计模式 API 数据处理
Spartacus 在 PDP 页面点击 Add to Cart 之后,读取最新 product 数据的设计
Spartacus 在 PDP 页面点击 Add to Cart 之后,读取最新 product 数据的设计
20 2
|
12天前
|
存储 监控 数据库
SAP 电商云 product catalog 从 staged 到 online 两个版本之间的同步
SAP 电商云 product catalog 从 staged 到 online 两个版本之间的同步
15 1
|
12天前
|
监控 安全 数据管理
SAP 电商云 Product catalog 的 staged 和 online 两种版本的设计理念
SAP 电商云 Product catalog 的 staged 和 online 两种版本的设计理念
12 1
|
12天前
|
缓存 数据处理 UED
Spartacus cart item remove 不会进入到 59 行这个分支
Spartacus cart item remove 不会进入到 59 行这个分支
12 0
|
12天前
|
存储 缓存 数据管理
Spartacus cart list item 删除的实现原理
Spartacus cart list item 删除的实现原理
5 0
|
12天前
|
前端开发 搜索推荐 JavaScript
Spartacus Cart item 点击了 remove 之后 HTTP Delete 请求的触发逻辑 - Adapter
Spartacus Cart item 点击了 remove 之后 HTTP Delete 请求的触发逻辑 - Adapter
13 0
|
12天前
|
开发者 UED
Spartacus cart 点了 remove 之后的 HTTP Delete 请求是怎么触发的
Spartacus cart 点了 remove 之后的 HTTP Delete 请求是怎么触发的
14 0
|
12天前
|
前端开发 搜索推荐 开发者
Spartacus empty cart 页面的显示逻辑
Spartacus empty cart 页面的显示逻辑
20 0