SAP Fiori UI5简介，系统搭建以及开发实践

woniu_maggie

已于 2025-06-30 11:29:47 修改

阅读量362

点赞数 4

CC 4.0 BY-SA版权

分类专栏： SAP Fiori 文章标签：开发语言后端

于 2025-06-30 10:57:08 首次发布

本文链接：https://blog.csdn.net/woniu_maggie/article/details/149018465

SAP Fiori 专栏收录该内容

1 篇文章

订阅专栏

前言
近年来，SAPUI5(SAP Fiori 2.0)的普及，云时代下的移动Web应用一路高歌，众多SAP 顾问也将焦点投入到了这个前端框架。

那么作为一款和SAP 系列套件深度结合的框架，需要安装很多组件支持Fiori的系列开发，可能我们并不会去做SAP Basic的相关工作，但是作为一名合格的咨询顾问，需要了解它的原理。

项目技术分析
后端ODATA服务开发
在SAP Fiori应用开发中，后端ODATA服务是数据交互的核心。使用ABAP开发工具创建和配置ODATA服务，并设计数据模型。通过这一步骤，您将能够为前端应用提供稳定的数据支持。

前端SAP UI5环境搭建
SAP UI5是SAP Fiori应用的前端框架，提供了丰富的UI组件和强大的开发工具。需下载并安装UI5 SDK，并设置WebIDE或VSCode开发环境。随后，您将创建第一个Fiori应用，体验SAP UI5的强大功能。

项目及技术应用场景
SAP Fiori应用广泛应用于企业级应用开发中，特别是在SAP系统集成和用户界面优化方面。无论是企业内部的业务流程管理，还是对外的客户服务应用，SAP Fiori都能提供高效、直观的用户体验。

整体架构
一个Fiori的安装过程中包含了前端服务组件和后台服务数据，前端组件和后端组件组成了一个完成的系统，后台提供数据支持，前端用于展示，Fiori的功能才能正式开通。

这里通过一个简图，帮助理解Fiori的整体架构示意：

Client客户端
客户端包括运行与浏览器端的WEB应用，运行与手机端的Hybrid的移动应用，主要是应用SAPUI5框架进行数据交互和展现。

ABAP Front-End Server ABAP前端服务器
前端服务器类似于一个web server, 负责前端APP的部署，和后台数据的交互，前端服务包含UI组件和Gateway，均基于SAP Netweaver平台，通常情况下，二者均部署在同一台服务器上。

Front-End-Server包含SAP Fiori Launchpad，它是所有SAP Fiori UI的基础，为Fiori应用提供了例如登录、界面适配、不同应用间跳转以及基于角色的应用分类等基础功能。

最终用户也是通过Fiori Launchpad来访问Fiori应用。

前端服务也包含SAP Gateway，负责处理客户端与SAP Business Suite后端的通信。Gateway使用ODate服务来提供后端数据、函数，以及处理OData服务的HTTPS请求。

ABAP Back-End Server ABAP 后端服务器
ABAP Back-End Server提供业务逻辑和后端数据，其中包括用户、角色和权限。SAP Fiori应用的Addon会持续在Support Package支持包中发布。后端服务器也是基于SAP Netweaver的，这样整体贴合统一，成为一个比较完整的平台。

Database 数据库
后台数据库现如今主要有两种，一个Any DB, 一个HANA DB, HANA DB具备大数据分析处理能能力，此类数据库支持全部Fiori应用类型。

但是Any DB就比较局限，跟多的部署事务类型的应用。

所以有HANA平台做支撑，前端的施展空间非常大。

SAP Fiori的历史背景

2013年，Fiori 第一次出现在人们的视线内，当时的Fiori还只是一些App应用，后来转向了SAP软件的 ‘new User eXperience’ 的概念。
2016年10月，Fiori 2.0开始了，它代表了SAP S/4 HANA和SAP商业套件在UX方面的一个演进，从SAPUI5版本1.40或更高，SAP2.0开始更关注用户和用户的工作方式，提供了跨内部和云解决方案的统一用户体验。
2019年9月份，最新的SAP Fiori 3设计的第一部分在SAP S/4HANA 1909和SAP S/4HANA Cloud 1908中发布。SAP Fiori 3的主要动机之一是开发一种可以跨所有SAP产品采用的设计，使用户可以获得更一致和集成的体验，在Belize主题的基础上发布了SAP Quartz Light 主题，SAPUI5 1.65版本或更高，新设计更好地与背景融合，允许自定义，将重点放在应用程序内容上，使其更加突出，为智能套件的应用铺好了路。

Fiori简单介绍
SAP Fiori 包含三个维度：

SAP Fiori概念。这个概念就是“User Experience”，它的5个原则基于角色role-based, 响应式responsive, 简化simple, 连贯一致coherent, 好看delightful。
SAP Fiori设计。SAP Fiori设计是在SAP Fiori设计指南中定义的视觉设计、信息架构、颜色和交互模式。
SAP Fiori技术。SAP Fiori技术包含构建、提供和运行SAP Fiori应用程序所需的所有体系结构、技术、基础设施和编程模型组件。

Fiori Apps
在sapfiori 2.0中，除了使用SAPUI5构建的SAP Fiori应用程序之外，还有使用不同UI技术的Classic 应用程序，如Web Dynpro或SAP GUI。这些经典的应用程序与SAP Fiori应用程序共享一个和谐的主题，但是它们仍然不能满足SAP Fiori应用程序的所有标准。经典的应用程序可以从SAP Fiori launchpad中调用，但必须专门进行配置。

SAP Fiori: Setup and Configuration
在实施具体APP之前，必须要安装SAP Fiori system landscape并且完成Fiori的相关配置。Fiori App由前端组件和后端组件两部分，前端提供用户界面并且连接后端，后端提供数据。这两部分组件是单独的产品，需要单独安装，安装后经过配置包含Launchpad的内的SAP Fiori infrastructure。

Setup SAP Fiori System Landscape
不同类型的APP，SAP Fiori system landscape包含不同的组件（System landscape可以翻译成系统环境）。

上面图就是一个比较详细的系统环境架构图，适用于企业的内部网络，如果是放在云或者互联网访问，则需要再考虑一些安全访问相关的组件。关于部署可以参考【SAP Fiori Deployment】

Components of the System Landscape构成SAP Fiori系统环境的组件
取决于APP的类型，会有可能用到下面这些组件：

Client客户端
为了能够运行 SAP Fiori APP，客户端的运行时环境（如浏览器）必须支持 HTML5。
SAP Web Dispatcher
SAP Fiori 应用的处理方式如下：首先，客户端加载 SAP Fiori 应用的 UI。然后在运行时，应用程序使用来自后端系统的数据。SAP Fiori 应用会根据应用程序类型和连接的系统环境向多个系统发送请求。通常浏览器都具有"Same origin"策略，即对 UI 数据的 HTTPS 请求和后端数据必须通信就同一个地址。也就是说UI访问前端应用和后端数据要使用同一个网址域，所以为了满足这个要求，必须安装客户端和 SAP 系统之间的反向代理服务器。反向代理服务器充当所有 HTTPS 请求的唯一入口点。根据应用发送的请求，反向代理服务器选择适当的应用程序服务器、ABAP 前端服务器或 SAP Gateway服务器。当然，其他反向代理服务器产品可以使用，SAP肯定推荐自家Web Dispatcher。
ABAP Front-End Server
ABAP 前端服务器包含用于生成 SAP Fiori APP的UI的组件以及与后端系统通信的所有基础结构组件，UI 组件和Gateway是基于 SAP NetWeaver的。通常两者都是部署在同一服务器上。
中央 UI 组件（Central UI component）是为所有 SAP Fiori 应用提供通用基础结构的框架：SAP Fiori Launpad是所有 SAP Fiori UI 的基础，为 SAP Fiori 应用提供基本功能，如登录、表面大小调整、应用间导航和基于角色的应用分组。用户从 SAP Fiori 启动板访问 SAP Fiori 应用程序。
SAP Gateway用来处理Client和后端的通讯，它使用 OData 服务提供后端数据和Function，并处理 OData 服务的 HTTPS 请求。
ABAP Back-End Server
ABAP 后端服务器提供业务逻辑和后端数据，包括用户、角色和
授权等。后端服务器是基于 SAP NetWeaver的。（它通常是核心系统，但不局限于核心系统）
Database
数据库为后端服务器存储数据。（实际上前端也是有数据库的，图中应该是怕混淆就没有列出）

安装
就是安装上面提到的各个组件，SAP 推荐使用Maintenance Planner来计划和下载前后端需要的组件，它会根据用户当前的系统Landscape和用户选择将要安装的Fiori App给出要下载和安装的组件列表并提供下载。当然，用户也可以从SWDC手工下载。

安装前有一些因素需要考虑，这些因素会影响到后面的安装，比如网络布局，是否单点登录，数据库的一些要求，后端组件的一些必须条件，角色和权限，操作系统等等。

简单说有下面几个组件：

安装SAP Web Dispatcher
安装Front-End Server（有可能会涉及一些特殊APP使用的组件和多语言安装）
安装前端和后端需要的SAP Note
安装设置Client
至于具体的安装有几种工具和方式：

Maintenance Planner
SUM
SPM

目前最新的是Front-End Server 3.0 ，主要有下面几个组件：

Configuration of SAP Fiori Infrastructure
配置

初始安装Fiori Launchpad和Launchpad Designer需要激活OData服务和相应的ICF服务。这些服务可以手工一个个激活，SAP提供了一种更简单便捷得方式，Task List，SAP Gateway为Fiori Launchpad和Fiori APP提供了基础架构，必须在Gateway中启用这一Odata服务以在OData技术服务(OData technical service)和对应的后端服务之间建立一个Mapping关系。
可以使用这个task list来完成SAP_FIORI_LAUNCHPAD_INIT_SETUP

ABAP Task Manager
这个概念应该很早就有了，就是配置工作的自动化，SAP为下面这些工作提供了Task List:

ABAP Init Setup。新系统安装完成后的一些初始化工作，比如安装SAP license，创建登录组，配置TMS等等
ABAP Post-Copy Automation。（这个基本用不着）
SAP Fiori Setup。从SAP NetWeaver 7.4 SP 6开始，可以使用SAP提供的task list来完成SAP Fiori的setup工作。它就是通过一些预定义的task list来自动的实现ABAP 系统配置，对于SAP Fiori来说，Task list就是帮助完成client、前端server、后端server之间通道的安装和配置。说白了就是一个程序成型一些SAP提供的预定义好的任务。一键执行，不能再方便了。
Security Checks。主要是执行安全系统冒烟测试，例如检查安全套接字层（SSL）配置或基础系统配置。
Embedded Search。

Transaction	Description
STC01	ABAP task manager for lifecycle management automation
STC02	Task list run monitor

前提条件
SAP NetWeaver 7.4 SPS 6 or later，需要先打下面的Note
SAP NetWeaver 7.4 SPS SAP Note
SPS 6 2017302
SPS7 2017302
SPS8 2088777 2120509
SPS9 2088777 2120509
SPS10 2120509