SAP新一代全栈开发工具：SAP Business Application Studio

这是Jerry 2020年的第29篇文章，也是汪子熙公众号总共第212篇原创文章。

作为SAP从业者，我们能够清楚地感受到这些年SAP技术进化的趋势。

SAP前端开发技术的进化方向，从SAP GUI，到能在浏览器里运行的ABAP Webdynpro / WebClient UI，再到现在仍然没有停止进化的Fiori UX. 而Fiori也从诞生之初只支持SAP UI5，进化到现在能够同时支持Angular, React和Vue等多种前端框架。

关于SAP前端技术的演进，可以参考Jerry这些文章：

• SAP UI和Salesforce UI开发漫谈
• SAP Fiori + Vue = ？
• Fiori Fundamentals和SAP UI5 Web Components
• 用React开发SAP Fiori应用

而SAP后端开发技术，自从SAP云平台问世以后，SAP开发人员发现，自己手头可选的技术，除了ABAP以外，一下子增加了很多：比如开源社区非常活跃的Java和nodejs，终于也能够应用到SAP后台开发中来了。而SAP云平台本身，也从诞生之初纯粹由SAP自己架设数据中心的单一云架构，演进到如今能支持GCP, Azure, AWS和阿里云等作为基础设施层的Multiple Clou架构。

本文咱们不聊具体的技术，而是谈谈开发工具。

Jerry之前的文章 那些年我用过的SAP IDE，介绍过我曾经用过的SAP开发工具。如今，这个列表里又多了一个新的成员。

2019年TechEd上，SAP向外界宣布了一款在原有SAP WebIDE基础上进化而成的新一代全栈开发工具：SAP Business Application Studio.

SAP开发人员能够用这个新工具做什么？

SAP Business Application Studio针对不同的SAP解决方案提供了良好的支持，能够进行S/4HANA扩展开发，以及基于SAP CAP模型(Cloud Application Programming)的全栈式开发(技术栈是Java和nodejs), 以及各种类型的Fiori应用开发。

SAP Business Application Studio同SAP WebIDE有何不同？

SAP官方将Business Application Studio称之为WebIDE进化后的产物，该工具吸取了当今业界领先IDE的设计理念，专门为SAP云平台上的全栈应用开发进行过优化；工具提供的强大命令行工具，使得开发人员不会被GUI界面所束缚。

最后，Business Application Studio基于Eclipse Theia这款开源的IDE，这使得它从架构上来说，可以从容应对任何在云端开发领域涌现出的新需求。

https://theia-ide.org/

举个例子，我们在Business Application Studio(下文简称为BAS)的插件列表里，能看到许多插件，有的是开源社区贡献的插件，比如vscode-eslint, 有的则来自SAP自研，比如vscode-mta-tools, 能够让开发人员利用BAS的命令行，无需登录SAP云平台控制台，就可进行SAP MTA应用的开发和部署。

在使用BAS之前，我们先来了解一个概念：Dev Space(开发空间).

一个开发空间是一个预先配置好的环境，背后实际对应了SAP云平台上的虚拟机。创建开发空间时，可以选择不同的类型，每个类型对应一种特定的开发场景。

 

每个特定类型的开发空间，都事先激活了完成该类开发任务所必须的Studio扩展(SAP Predefined Extensions)，在创建开发空间时可以看到这些扩展列表。

我选择的是SAP Fiori类型的空间，创建成功后，点击超链接进入：

如果是在WebIDE里，开发界面打开后，我们就可以用Create from Template菜单，通过向导来完成Fiori应用的创建。

在BAS里，我们可以换一种方式，通过命令行来创建Fiori应用的骨架。

命令行里键入yo，启动SAP Fiori Project Generator, 选择Fiori Project：

接下来是选择该Fiori应用的运行环境，有CloudFoundry和ABAP两种选择，我们选择前者：

然后是一些常规信息的维护。

命令行向导执行完毕后，就生成了Fiori应用必须的资源文件。做过nodejs开发的朋友，会发现这个步骤和用npm init生成manifest.json文件很像。

我们要指定这个Fiori应用应该消费哪个OData服务。

在Studio上方的命令工具栏里，敲consume，选择Consume SAP Services：

会显示很多Destination列表，每个Destination都是我在CloudFoundry环境的Connectivity菜单里维护的，指向某一个ABAP系统。

我选择ES5系统里暴露出来的GWSAMPLE_BASIC这个OData服务。

改OData同Fiori项目绑定之后，收到成功的提示：

后续的操作，就和我们之前在SAP WebIDE里的开发没有太大差别了。

用Layout Editor打开XML视图，从控件库里找到List控件，拖拽到视图区域上：

点击List控件Entity Set字段旁的绑定图标，给它绑上一个OData模型中的Data Collection：

让这个List显示Business Partners数据：

同理，把List Item的title字段绑定到BusinessPartnerSet节点上的CompanyName字段，Description绑定到BusinessPartnerID字段。

这个Fiori应用功能非常简单，以列表的形式显示Business Partners所在的公司名和ID.

点击Run Configuration, 可以在不部署到SAP云平台CloudFoundry环境的情况下，进行本地测试：

SAP云平台上的Fiori应用，实际上是SAP MTA应用包含的一个HTML5 module，该MTA应用的mta.yaml里定义了Destination服务和Authorization & Trust Management服务的依赖。因此本地运行时，我们也要给该Fiori应用提供这两个服务实例才行。

 

关于什么是SAP MTA应用，可以参考Jerry之前的文章：SAP云平台里的三叉戟应用。

到CloudFoundry环境新建一个Authorization & Trust Management服务实例，取名app_uaa:

回到BAS，选中项目里的uaa本地资源，会看到右边有个小的绿色插头图标。点击之后，BAS会自动把刚才创建的app_uaa实例取出来。选择后，就可以和项目本地uaa_JerryFioriDemo这个资源进行绑定。

稍后我们将该应用正式部署到SAP云平台CloudFoundry环境时，不需要做这一步，因为部署工具会解析mta.yaml, 自动创建里面定义的依赖服务实例。

成功绑定后，在BAS里收到提示：

同时左边出现一个新的绿色插头图标，代表成功绑定的状态。

同理将项目的Destination服务依赖也绑定到CloudFoundry环境创建的服务实例后，点击Run Module, 就能看到这个Fiori应用的界面了：

正式部署到CloudFoundry的步骤也很简单，执行命令行：

mbt build -p=cf

mbt工具会将该项目打包成.mtar文件：

使用cf deploy命令把这个.mtar文件部署到CloudFoundry去：

从命令行输出中可以发现，cf deploy在部署过程中会自动创建mta.yaml里require区域声明的服务实例。

部署成功后，这些自动创建的服务实例都能在Service Binding区域看到：

点击部署后生成的AppRouter实例，就能获得这个运行在CloudFoundry环境上的Fiori应用的访问链接了。

整个流程跑下来，个人感觉体验和Google的Cloud Shell一样优秀。关于Google的这个云端开发工具介绍，请参考Jerry的文章：介绍一个免费的云开发工具：Cloud Shell.

希望本文能够让大家对SAP Business Application Studio的概貌有个最基本的了解，感谢阅读。

更多阅读

• SAP UI和Salesforce UI开发漫谈
• SAP Fiori + Vue = ？
• Fiori Fundamentals和SAP UI5 Web Components
• 用React开发SAP Fiori应用
• 那些年我用过的SAP IDE
• SAP云平台里的三叉戟应用
• 介绍一个免费的云开发工具：Cloud Shell