SAP Business Application Studio(BAS)中开发Fiori App的基础知识

1. SAP Fiori Tools

SAP Fiori Tools是一套用于支持SAP Fiori应用开发的工具，包括应用模板、可视化编辑器、代码生成、应用预览和集成测试工具等。这些工具可以帮助开发者更快速、更简单地创建和维护SAP Fiori应用。SAP Fiori Tools 可与SAP的开发环境（例如SAP BAS）和部署环境（例如SAP BTP）无缝集成。

SAP Fiori Tools支持了Fiori App的整个开发周期，包括项目生成，本地测试（运行应用、从后台抓取数据、app-to-app的导航测试）以及最终的部署。Fiori Tools也支持VS Code和命令行访问。

对于开发者而言，开发一个连接SAP数据源的Fiori应用程序有两种方式：一种是基于SAP Fiori Element，另一种是SAP Fiori Freestyle。

1.1 SAP Fiori Element

SAP Fiori元素为开发人员提供了一系列的预定义模板，我们可以直接使用标准模板开发应用程序，这样不仅可以提高开发效率，还可以统一用户体验。

使用SAP Fiori元素时，用户前台界面UI的实现是基于OData服务和注释的，不需要JavaScript UI编码。SAP Fiori元素运行时，会解释底层OData服务的元数据和注释，并在启动时为SAP Fiori应用程序自动生成相应的视图。

1.2 SAP Fiori freestyle

SAP Fiori freestyle是开发SAP Fiori应用程序的另一种选择。通过使用SAP Fiori自由式模板，开发人员可以灵活地基于OData服务和JavaScript UI编码创建自定义应用程序。

2. UI5 CLI (命令行界面）

SAPUI5 CLI 是UI5工具套件的一部分, UI5 CLI 提供了一系列的命令工具，这些命令可以帮助开发者更有效地创建和管理SAP UI5项目。在实际开发中，可以使用SAP Fiori Tools来创建和设计应用，然后使用UI5 CLI来构建和部署应用。

SAP UI5 CLI的配置是在ui5.yaml中完成的，额外的配置会存储在例如ui5-local.yaml或ui5-cli.yaml中。

配置文件中的 fiori-tools-proxy : 是指代理到后台系统；fiori-tools-appreload 是指当发生代码改动后自动重新加载。

3. 应用信息

创建或克隆了一个Fiori Element项目时，BAS会自动打开应用信息界面Application Info。在这个界面上可以看到项目的详细信息（项目类型、SAPUI5版本等），状态信息（项目的依赖信息），以及一些建议的action。

可以通过命令面板的 Fiori: Open Application Info 命令打开这个页面。

4. 运行一个Fiori App

运行Fiori App可以通过以下几种方式：

• 运行配置Run Configuration 
• 通过UI运行NPM脚本
• 通过terminal运行NPM脚本
• 通过terminal直接调用

可以使用Application Info > Preview Application 选项来列出所有的运行选项，然后通过 start* 筛出来运行app的NPM脚本。

5. 运行时配置Run Configurations 

Run Configurations 功能允许你定义和管理应用程序的配置, 这些配置可以包括启动脚本、环境变量、命令行参数等, 它本质上是运行了以下命令：

npx fiori run --open filename.html

创建一个新的配置可以有以下设置：

1. 配置的名称
2. 文件名：选择用于启动应用程序的html文件
3. 模拟数据Mock Data: 使用一个mock server来模式Odata请求服务
4. 支持助手：检查这个应用程序的构建是否符合构建SAPUI5应用程序的最佳实践
5. URL 组件：为SAP Fiori Launchapd上基于网络的app间导航（app-to-app）定义额外的URL参数
6. 高级设置：定义使用的SAPUI5版本或应用使用的目标系统destination

你可以通过点击 "Run" 或 "Debug" 按钮来运行或调试你的应用程序。SAP BAS将使用你定义的运行配置来启动你的应用程序。

相关运行设置是存储在<workspace>/.vscode/launch.json 文件中的，开发人员可以定义多个可运行的配置文件。

6. NPM脚本

NPM (node package manager)是node.js的包管理工具， 用于管理node.js项目以及其依赖关系。Fiori Tools的内核是基于node.js的运行环境的，因而，每一个Fiori项目其实也会被管理成一个npm项目。

每一个Fiori项目其实也会被管理成一个npm项目。

NPM脚本（NPM scripts）是在package.json文件中定义的一组命令，这些命令可以帮助你自动化开发流程中的一些常见任务，如构建、测试、部署等（见下图的scripts）。我们也可以从管理器Explorer中的NPM Scripts View或通过terminal来启动NPM脚本。

以下是使用NPM脚本的一般步骤：

1. 在package.json文件中定义脚本：

在package.json文件的scripts字段中，你可以定义你需要的脚本。例如，你可以定义一个start脚本来启动你的应用，或者定义一个test脚本来运行你的测试。
{
  "name": "my-app",
  "version": "1.0.0",
  "scripts": {
    "start": "node app.js",
    "test": "mocha tests/"
  }
}

2. 运行脚本：

定义好脚本后，你可以通过npm run命令来运行这些脚本。例如，你可以运行npm run start来启动你的应用，或者运行npm run test来运行你的测试。注意，对于start和test这两个特殊的脚本，你也可以直接运行npm start和npm test，而不需要加run。

7. 端口预览（port preview）

在SAP BAS中端口（port）是一个重要的概念, 它是用于网络通信的一个接口，可以被应用程序用来接收或发送数据。

在SAP BAS中，每个Dev Space都有一组专用的端口，这些端口可以被Workspace中的应用程序使用。例如，你可以在开发工作空间中启动一个Web服务器，然后通过一个特定的端口来访问这个服务器。

SAP BAS的端口功能有以下几个主要特点：

• 自动端口转发：当你在工作空间中启动一个服务时，SAP BAS会自动为这个服务分配一个端口，并将这个端口转发到你的本地机器。这意味着你可以在本地浏览器中通过这个端口来访问你的服务。
• 端口管理：SAP BAS提供了一个端口管理面板，你可以在这个面板中查看和管理你的端口。例如，你可以查看哪些端口正在被使用，或者手动添加新的端口转发。
• 安全性：为了保证安全，SAP BAS只允许工作空间内的服务访问这些端口

在命令面板中输入Ports: Preview命令，列出所有正在运行的应用程序及其端口。

8. 示例：通过terminal运行Fiori App

Step1: 安装所有的依赖 npm install

Step2: 启动npm脚本，npm run start

Step3: 在不同的SAPUI5版本下运行应用程序

通过不同Run Configurations中的配置，可以选择SAPUI5的版本。

9. 参考资料：

•  SAP Fiori tools | SAP Help Portal
•  UI5 CLI - UI5 Tooling (sap.github.io)

•  SAP Help Portal for BAS

•  SAP Community for BAS