在我的CloudFoundryFun系列的第五篇文章中，我将展示如何将使用任何UI框架编写的web应用部署到cloudfoundry。为此，消防物联网，我特意没有选择SAPUI5应用程序，而是选择了一款用Facebook的反应.js. 因为我不想让任何人玩这个游戏，所以我用SAP云平台身份提供商（IdP）来保护它。

现在在云时代，web界面是各种应用程序事实上的标准界面。很难想象云应用程序没有web界面。即使是像WhatsApp这样的"移动第一应用程序"也有非常成功的web界面，像Excel Online这样的经典"桌面"应用程序也是如此！网络技术易于学习，标准化程度高。尽管有这么多的标准化，web技术仍然提供了很大的灵活性。这种灵活性得到了大量开发人员的认可，并为OpenUI5或React等众多UI框架奠定了基础。当我们想到web技术时，我们常常想到前端UI框架。我们往往会忘记后端技术，这是我们完成不同任务所需要的。这就是为什么我把这篇博文专门放在一个支持应用程序后端部分的服务上。

前端应用程序与后端服务

前端框架通常帮助我们引导应用程序并呈现HTML DOM，大数据能做什么，成都大数据，例如减少繁重的计算任务。与此相反，后端技术处理两种类型的任务。计算量大的任务，大数据的培训，例如处理最新的数据，轻量级任务，例如为应用程序的静态文件提供服务。为这两种类型的任务扩展服务器并不容易。根据哪些任务比其他任务重要，后端服务器的资源消耗不同。你可以在每月的账单中看到不同的资源消耗模式。这就是SAP提供HTML5应用程序存储库服务的原因。

我知道你现在可能会怎么想："为什么我需要这个服务来服务静态文件。我不能用一个简单的HTTP服务器来托管我的web应用吗。我想说你是完全正确的。这个解决方案可以在很短的时间内实现，并且可以很好地用于简单的场景。但是，对于更复杂的场景，它会变得更困难，因为您可能会面临以下要求：

安全性–您的服务器需要检查UI文件是否应该实际交付给用户。这意味着您将需要实现一个安全检查，或者甚至可能实现一个OAuth流。

集成——在几乎所有情况下，UI都会附带上述计算量大的后端任务。这些请求需要与静态内容来自同一服务器，以遵循浏览器的同源策略。因此，您需要注意应用程序的两个部分的集成。

扩展–随着后端代码的增长和变得更加复杂，您可能需要更多的计算能力。如何同时扩展后端任务（为静态内容提供服务）和后端逻辑的执行？

可扩展性–您可能希望在不同的应用程序之间共享UI库。如何从不同的项目甚至从不同的云计算空间访问UI文件？

缓存——这一点非常重要，特别是对于经常请求的应用程序。智能缓存可以帮助您以后扩展并节省实际资金！

所有这些方面都需要修改您的标准web服务器，使简单的场景更加复杂。你不会想实现所有这些需求，尤其是因为approuter已经实现了它们。此外，它还与HTML5应用程序存储库服务完美集成。您希望以云本地方式提供文件。在大多数情况下，你并不关心如何使用，这正是你想使用HTML5应用程序存储库服务的原因。

注意：如果你已经购买了应用程序运行时，你也已经购买了该服务。

如何使用HTML5应用程序存储库

使用该服务非常简单。你只需要把你准备好的（又称丑陋的）web应用程序推到HTML5应用程序Repo上。这可以通过以下两种方式之一完成：

您可以利用npm包@sap/html5 app deployer的上传脚本，该脚本可以集成到您的多目标应用程序（MTA）部署流中。您可能已经看到了这个脚本的实际应用，这就是webide在幕后为您所做的。您可以为cloudfoundry CLI使用HTML5应用程序存储库插件。使用此插件，您可以运行以下命令将web应用程序推送到存储库。这是我们稍后将使用的方法。cf html5 push

如前所述，大部分所需功能已经在app router中实现，可通过SAP的npm存储库获得。应用程序路由器可以无缝集成存储库中的应用程序。要将HTML5存储库集成到应用程序路由器中，您需要完成以下两个步骤：

动手：在SAP云平台上部署Reacteroids

为了这次动手，我选择了一个非常流行的arcade，它已经在React:Reacteroids中重新实现。（React是Facebook构建用户界面的非常流行的JavaScript框架。）

之前有趣的是，我们需要在SAP云平台上安装一些云开发必需的工具（如果您还没有这样做）：

设置您的本地开发环境

这就是部署React应用程序所要做的一切！