SAP CAP篇七：为CAP添加Fiori Launchpad入口 (Sandbox环境)

本系列文章

SAP CAP篇一: 快速创建一个Service，基于Java的实现
SAP CAP篇二：为Service加上数据库支持
SAP CAP篇三：定义Model
SAP CAP篇四：为CAP添加Fiori Elements程序(1)
SAP CAP篇五：为CAP添加Fiori Elements程序(2)
SAP CAP篇六：为CAP添加Fiori Elements程序(3)
SAP CAP篇七：为CAP添加Fiori Launchpad入口 (Sandbox环境)
SAP CAP篇八：为CAP添加App Router并支持Fiori Launchpad (Sandbox环境)
SAP CAP篇九：升级为SAP CDS 7.0, CAP Java 2以及Spring Boot 3
SAP CAP篇十：理解Fiori UI的Annoation定义
SAP CAP篇十一：支持Media Object：图片、附件等
SAP CAP篇十二：AppRouter 深入研究

在现有代码基础上继续增强

根据从篇四到篇六的修改和增强，现有的代码结构如下：

增强app文件夹

在app文件夹中添加如下文件：

• package.json
• appconfig folder

文件 package.json

正如在篇四提到的那样，这里app文件夹其实是为approuter准备的，所以，package.json的定义如下：

{
	"name": "approuter",
	"dependencies": {
		"@sap/approuter": "^13"
	},
	"scripts": {
		"start": "node node_modules/@sap/approuter/approuter.js"
	}
}

文件夹appconfig

在app文件夹下新建子文件夹appconfig。该文件夹用来提供Fiori Launchpad的Sandbox系统。真正Deploy到SAP BTP上时，需要遵循Launchpad 定义的标准。

文件fioriSandboxConfig.json

在新创建的appconfig下创建fioriSandboxConfig.json。该文件用来定义一个Launchpad的Sandbox环境。

{
    "services": {
        "LaunchPage": {
            "adapter": {
                "config": {
                    "catalogs": [],
                    "groups": [
                        {
                            "id": "Admin",
                            "title": "Admin",
                            "isPreset": true,
                            "isVisible": true,
                            "isGroupLocked": false,
                            "tiles": [
                                {
                                    "id": "manage-books",
                                    "tileType": "sap.ushell.ui.tile.StaticTile",
                                    "properties": {
                                      "targetURL": "#Books-manage",
                                      "title": "Manage Books",
                                      "description": "Find your favorite book"
                                    }
                                }
                            ]
                        }, {
                            "id": "Book",
                            "title": "Book",
                            "isPreset": true,
                            "isVisible": true,
                            "isGroupLocked": false,
                            "tiles": [
                                {
                                    "id": "browse-books",
                                    "tileType": "sap.ushell.ui.tile.StaticTile",
                                    "properties": {
                                      "targetURL": "#Books-display",
                                      "title": "Display Books",
                                      "description": "Find your favorite book"
                                    }
                                }
                            ]
                        }
                    ]          
                }
            }
        },
        "NavTargetResolution": {
          "config": {
            "enableClientSideTargetResolution": true
          }
        },
        "ClientSideTargetResolution": {
            "adapter": {
                "config": {
                    "inbounds": {
                        "manage-books": {
                            "semanticObject": "Books",
                            "action": "manage",
                            "signature": {
                              "parameters": {},
                              "additionalParameters": "allowed"
                            },
                            "resolutionResult": {
                              "applicationType": "SAPUI5",
                              "additionalInformation": "SAPUI5.Component=manage-books",
                              "url": "/manage-books/webapp"
                            }
                        },
                        "browse-books": {
                            "semanticObject": "Books",
                            "action": "display",
                            "signature": {
                              "parameters": {},
                              "additionalParameters": "allowed"
                            },
                            "resolutionResult": {
                              "applicationType": "SAPUI5",
                              "additionalInformation": "SAPUI5.Component=browse-books",
                              "url": "/browse-books/webapp"
                            }
                        }              
                    }
                }
            }
        }    
    }
}

这里的Sandbox的inbound定义，完全对应了篇六的两个Fiori Elements程序的"semanticObject":和
“action”。

该配置要要求接入口为fiori.html，所以，继续创建该HTML文件。

文件 fiori.html

文件fiori.html是用作Fiori Launchpad的入口程序——类似于绝大多数的HTML程序的index.html一样。所以，这个fiori.html是标准的Fiori Launchpad的定义文件。

在app文件夹下添加该HTML文件：

<!DOCTYPE html>
<html>
<head>

	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Fiori</title>

	<script>
		window["sap-ushell-config"] = {
			defaultRenderer: "fiori2",
			applications: {}
		};
	</script>

	<script id="sap-ushell-bootstrap" src="https://sapui5.hana.ondemand.com/1.115.0/test-resources/sap/ushell/bootstrap/sandbox.js"></script>
	<script id="sap-ui-bootstrap" src="https://sapui5.hana.ondemand.com/1.115.0/resources/sap-ui-core.js"
			data-sap-ui-libs="sap.m, sap.ushell, sap.collaboration, sap.ui.layout"
			data-sap-ui-compatVersion="edge"
			data-sap-ui-theme="sap_horizon"
			data-sap-ui-frameOptions="allow">
	</script>
	<script>
		sap.ui.getCore().attachInit(()=> sap.ushell.Container.createRenderer().placeAt("content"))
	</script>

</head>
<body class="sapUiBody" id="content"></body>
</html>

更新Srv中的UiIndexContentProviderFactory

更新UI index的入口：

	@Override
	public void writeContent(PrintWriter writer, String contextPath) {
		writer.print(ENDPOINT_START);
		writer.printf(ENDPOINT, contextPath + "/fiori.html", "Fiori Launchpad");
		writer.print(ENDPOINT_END);
	}

再次检查代码

根据本篇的增强后，代码结构最新如下：

运行效果

代码库 (Gitcode)

与本文配套的代码

参考README.md关于各个branch的详细介绍。

本篇对应的branch是3_withlaunchpad。