SAP Fiori Elements 应用里的 ui5.yaml 文件详解试读版-526互联

本教程第 4 篇文章，我们介绍了本地启动 SAP Fiori Elements 应用的三种模式。

以默认方式即命令行 yarn start 启动之后，项目文件夹里的 ui5.yaml 文件会默认被加载并解析。

ui5.yaml 这个文件，在本地开发 Freestyle UI5 时也会遇到，笔者在另一套教程一套适合 SAP UI5 开发人员循序渐进的学习教程里曾经介绍过：

本文继续介绍这个 ui5.yaml 文件和 Fiori Elements 本地开发相关的知识。

迄今为止，我们开发的 Fiori Elements 应用的场景是，运行在本地，即 localhost:8080 的 Fiori Elements 应用，去调用部署在 SAP ES5 服务器上的 OData 服务，将 OData 服务调用结果显示在浏览器里。

本地应用的协议是 http, 主机名 localhost, 端口号 8080
远端 ES5 OData 服务的地址：https://sapes5.sapdevcenter.com，协议是 https, 主机名 sapes5.sapdevcenter.com，端口号 80.

因此这是一个典型的浏览器跨域访问的场景，直接在本地 Fiori Elements 应用里通过 JavaScript 跨域访问 ES5 的 OData 服务，会被浏览器安全策略阻止。

既然浏览器跨域访问是一个极为常见的场景，因此解决这个问题，也存在各种各样的解决方案：

本教程使用的方式是在 ui5.yaml 里配置 fiori-tools-proxy 这个代理服务器的解决方案。

我们在 Chrome 开发者工具 network 面板里观察到 Fiori Elements 应用发起的 OData 请求 url：

http://localhost:8080/sap/opu/odata/sap/SEPMRA_PROD_MAN/

可以看到，这个 url 也是以 http://localhost:8080 开头，因此规避了跨域问题。

但是，localhost:8080 这个主机上并没有 /sap/opu/odata/sap/SEPMRA_PROD_MAN/ 这个 OData 服务，因为该服务是部署在 SAP ES5 服务器上的。

这就是 fiori-tools-proxy 代理服务器发挥作用的地方。

下面是本文的详细内容。