以SAP Cloud for Customer SalesOrder的搜索页面为例：

![](https://img-blog.csdnimg.cn/img_convert/5441cc9994f8103d399e553059daaf33.png)

我们看到的页面里显示的数据，仍然是C4C基于的SAP UI5实现里，采用AJAX调用，从C4C后台系统读取回前台的。

![](https://img-blog.csdnimg.cn/img_convert/a1eee5cc72fa000ffa64e48a2f14fb9a.png)

将上图高亮json请求保存到本地细细查看：

![](https://img-blog.csdnimg.cn/img_convert/95ac6d9a791b014fdb95057831749ea3.png)

这个json数据格式的结构反映了SAP C4C什么样的数据模型呢？

答案是SAP C4C UI模型的data model标签页里看到的数据结构：

![](https://img-blog.csdnimg.cn/img_convert/0f77ad8b9f8b276baca11f4a542aae1b.png)

上图的字段和我们从Chrome开发者工具里观察到的JSON data model的字段，具有一一对应的关系：

![](https://img-blog.csdnimg.cn/img_convert/f77dccc056159767699d9f0e517f44ae.png)

那么我们在UI上看到的Sales Order 表格里显示的数据，存储在json 模型里什么地方呢？

首先在data model标签页里，得知UI上的数据显示，来自BO CustomerOrder：

![](https://img-blog.csdnimg.cn/img_convert/96cf2ef930eaa21b08d34f0a8d1f4a7d.png)

而json数据里的CustomerOrder，分为三部分：

1. FieldCatalog
2. Elements
3. Header
![](https://img-blog.csdnimg.cn/img_convert/cc4590a260bc80f5f0d72e56dd60b5ce.png)

FieldCatalog包含了CustomerOrder这个BO每个字段的索引号：

![](https://img-blog.csdnimg.cn/img_convert/9473199ad4b3af7914c761f65a5e72f3.png)

比如索引19代表UUID字段。

Elements部分的结构，包含了SAP C4C UI上显示的实际数据。
![](https://img-blog.csdnimg.cn/img_convert/6f7af9fa867cc5e3e26a8d1dcc12f962.png)

SAP Cloud for Customer UI上的数据采取分页显示，总共281条sales order，分10页显示，每页显示30条数据：

![](https://img-blog.csdnimg.cn/img_convert/63083d74f2e8c0dcc65b65f089838ecf.png)

索引19代表的字段正是UUID，采取索引值的设计，避免了直接使用字段名来描述每条记录的key-value，减小了最后从后台传递到前台的json数据尺寸：

![](https://img-blog.csdnimg.cn/img_convert/a0366801b100a15f79aa0560044c4d00.png)

更多Jerry的原创文章，尽在："汪子熙":
![](https://img-blog.csdnimg.cn/img_convert/e4a8387dca5921e049fd05f96ef232ae.png)

ITPub博客

SAP Cloud for Customer(C4C)前台显示的数据是如何从后台读取的