使用 mock 数据在本地运行 SAP Fiori Elements 应用的工作原理

本系列的前两篇文章：

在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用
如何使用 mock 数据在本地运行 SAP Fiori Elements

本文研究 Fiori Elements 应用本地运行，而不是连接远程数据库，消费服务器 OData 服务的工作原理。

本地运行 SAP Fiori Elements 应用时，访问的 index.html 为：test 文件夹下的 flpSandboxMockServer.html

这个 id 为 sap-ui-bootstrap 的 script 标签里，定义了 SAP UI5 bootstrap 需要加载的 JavaScript Resource 文件：

这个 script data-sap-ui-use-mockserver 标签里，定义了为 true：

使用 mock server 的标志位，在 locate-reuse-libs.js 里被访问。在 callback 里执行 mock server 的 init 操作。

在 mock 模式下运行，metadata 的 url 也指向本地 xml 文件了：

mock server url：/sap/opu/odata/sap/SEPMRA_PROD_MAN/ 和正常模式下运行的 OData server url 相比没有变化，

关键的一个方法：

  // load local mock dataoMockServer.simulate(sMetadataUrl, {sMockdataBaseUrl: sJsonFilesUrl,bGenerateMissingMockData: true});

看 simulate 方法的注释：

Simulates an existing OData service by sepcifying the metadata URL and the base URL for the mockdata

通过指定 Metadata url 和 mockdata base url，来模拟一个 OData 服务。

The mockdata needs to be stored individually for each entity type in a separate JSON file. The name of the JSON file needs to match the name of the entity type.

每个 entity type 的 mockdata 必须单独存放在一个 json 文件里，且 json 文件的名称，必须和 entity type 完全一致。

如果没有提供 mockdata 的 base url，则 mockdata 基于 metadata 被创建。

1981 行的 _refreshData 方法，会加载本地存储的 json 文件包含的 mockdata：

接下来，是 mockserver 为不同类型的 HTTP 请求，注册不同的 handler. 这样，当 mock server 收到 SAP Fiori Elements 应用发起的 HTTP 请求时，这些 handler 会被调用，来返回 mock 过的数据。

每个 HTTP 请求 handler 在注册的时候，都会绑定一个 path，如下图 2179 的正则表达式所示，这代表了该 handler 能够处理哪些路径的 HTTP 请求。例如，当 url 包含 metadata 字符串时，触发下图的 metadata handler，将本地 localService 文件夹内的 metadata.xml，返回给请求的发起方。

mock server 响应其他请求的原理类似，这里就不再赘述了。

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

使用 mock 数据在本地运行 SAP Fiori Elements 应用的工作原理相关推荐

如何使用 mock 数据在本地运行 SAP Fiori Elements
打开 Jerry 前一篇文章在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用创建的 Fiori Elements 应用: 在 localService 文件 ...
深入理解 SAP Fiori Elements 工作原理系列之二：如何给 SAP Fiori Elements 应用添加自定义按钮
这是 Jerry 2021 年的第 33 篇文章,也是汪子熙公众号总共第 309 篇原创文章. Jerry 的日常工作内容从 2020 年 8 月转到 Angular 前端开发之后,算是领略到了这个流 ...
SAP Fiori Elements 在本地测试模式下如何修改 List Report 里字段标签和图标
通过 Jerry 这篇文章在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用介绍的步骤,创建一个简单的 SAP Fiori Elements 应用. 在 Vi ...
本地开发好的 SAP Fiori Elements 应用，如何部署到 ABAP 服务器上？
这是 Jerry 2021 年的第 29 篇文章,也是汪子熙公众号总共第 300 篇原创文章. 之前 Jerry 的两篇文章,分别介绍了如何在本地使用 Visual Studio Code 创建一个 ...
SAP Fiori Elements 本地项目的 annotations.xml 文件
SAP Fiori Elements 本地项目里的 Annotations.xml,可以定义一些本地 annotations,来覆盖掉来自后台 OData 服务里的注解. 例如:我在 Annotati ...
SAP Fiori Elements 框架里 Smart Table 控件的工作原理介绍
这是 Jerry 2021 年的第 34 篇文章,也是汪子熙公众号总共第 310 篇原创文章. Jerry 前一篇文章深入掌握 SAP Fiori Elements 工作原理系列之二:如何给 Fio ...
SAP Fiori Elements 公开课第二单元视频的台词和课程主要内容
课程地址很多 SAP 从业者反映,open SAP 上的视频,因为网络原因无法访问,所以我会陆续在我的个人微信号"汪子熙"上面,把这些视频配上中文字幕并发布出来,敬请关注. ...
SAP Fiori Elements 概述
SAP Fiori elements provide designs for UI patterns and predefined templates for common application u ...
在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用
这是 Jerry 2021 年的第 26 篇文章,也是汪子熙公众号总共第 297 篇原创文章. 本文绝非标题党. Jerry 前一篇文章 SAP Cloud Application Programmi ...

使用 mock 数据在本地运行 SAP Fiori Elements 应用的工作原理

使用 mock 数据在本地运行 SAP Fiori Elements 应用的工作原理相关推荐

最新文章

热门文章