SAP 电商云 Spartacus UI 客户端模式下产品主数据的 HTTP 请求设计

简介: SAP 电商云 Spartacus UI 客户端模式下产品主数据的 HTTP 请求设计

在客户端渲染即 CSR 模式下,我们能在 Chrome 开发者工具里观测到大量根据 product code 读取产品主数据的 HTTP 请求:

响应结果:




上面的数据,对应屏幕里这个产品:300938

通过 cx carousel 这个控件发起的 HTTP 请求:

这个高亮区域是 template:

即:

这个 template 是 carousel 的消费者在 html 里传入的:

消费者之一就是 cx-product-carousel:

product carousel 里的产品列表来自 productCodes 字段,通过 this.productService.get 根据产品 code 读取产品主数据

数据源来自依赖注入的 componentData.

什么时候被填充呢?

productCodes 的运行时数据:

准备渲染 ProductCarousel Component:

先得取得 ComponentData 的依赖:

找到了该依赖的 provide 记录:

调用 dataprovider,根据 uid 和 type 取得 ComponentData:

这里采取了一个延迟加载,当 Observable 被 subscribe 时,再执行:

什么时候被 subscribe 呢?答案如下:

items$ 的数据也来自 ComponentData:

ComponentData 数据读取,通过 cms service 完成:

从 store 里读取:

相关文章
|
3月前
|
应用服务中间件 nginx
百度搜索:蓝易云【HTTP请求是如何关联Nginx server{}块的?】
总结来说,Nginx中的 `server{}`块用于关联HTTP请求和虚拟主机,通过配置不同的 `server{}`块,可以实现多个域名或IP地址的请求分发和处理。这样,Nginx可以根据不同的请求来提供不同的服务和内容。
37 0
|
3月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)(上)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
29 0
|
3月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)(下)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
26 0
|
24天前
什么是 SAP ABAP 里的 Subscreen
什么是 SAP ABAP 里的 Subscreen
16 1
什么是 SAP ABAP 里的 Subscreen
|
1月前
|
数据采集 缓存 前端开发
http和https请求服务器的时候在请求头部分都带什么到服务器呢?
HTTP和HTTPS请求头基本结构相似,HTTPS多了一层SSL/TLS加密。常见请求头如Accept(指定内容类型)、Authorization(身份验证)、Cookie(会话跟踪)、User-Agent(标识用户代理)等。HTTPS特有的头包括Upgrade-Insecure-Requests(升级到HTTPS)、Strict-Transport-Security(强制使用HTTPS)、Sec-Fetch-*(安全策略)和X-Content-Type-Options、X-Frame-Options等(增强安全性)。实际应用中,请求头会根据需求和安全策略变化。
21 0
|
1月前
|
域名解析 缓存 网络协议
HTTP DNS的工作模式
【2月更文挑战第12天】
HTTP DNS的工作模式
|
3月前
|
Java API Spring
使用OkHttp在Spring Boot应用中发送HTTP请求
使用OkHttp在Spring Boot应用中发送HTTP请求
83 0
|
3月前
|
存储 缓存 安全
面试题:HTTP 协议包括哪些请求?
面试题:HTTP 协议包括哪些请求?
25 0
|
3月前
|
移动开发 自然语言处理 网络协议
Http解析实现/服务器Get请求的实现
Http解析实现/服务器Get请求的实现
47 0
|
3月前
|
Web App开发 网络协议 Linux
Linux C/C++ 开发(学习笔记十 ):实现http请求器(TCP客户端)
Linux C/C++ 开发(学习笔记十 ):实现http请求器(TCP客户端)
50 0