SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异

SAP Commerce Cloud Accelerator UI 基于 JSP,属于服务器端渲染技术,Commerce 服务器将渲染好的 HTML 页面发送给客户端。

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第1张图片

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第2张图片

当用户在当前页面点击某些元素,要跳转到新的 UI 时,这些新的 UI 和当前页面是由不同的 page 实现的。因此这些跳转操作,会触发浏览器向服务器发起新的页面请求(page request).

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第3张图片

客户端收到服务器发送的页面响应后,刷新自己的页面:

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第4张图片

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第5张图片

而 Spartacus UI 是单页面应用,客户端仅仅向服务器端请求一次页面模板代码( ng build 生成的 JavaScript 代码):
SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第6张图片

至于页面要显示的业务数据,通过 OCC API 调用向服务器端索取:
SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第7张图片

最后,客户端也就是浏览器里,执行 Angular 框架代码,执行页面模板对应的 JavaScript 代码,将服务器端返回的 OCC API 响应进行渲染,得到最后客户看到的 Storefront 页面。

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第8张图片

当然,Spartacus UI 也支持服务器端渲染模式:Server Side Render mode,简称 SSR,此时页面源代码的渲染是在 SSR 服务器上完成。OCC API 的调用,也是 SSR server 向 Commerce 服务器发起的。

SAP 电商云 Accelerator 和 Spartacus UI 的工作机制差异_第9张图片

更多Jerry的原创文章,尽在:"汪子熙":

你可能感兴趣的