Skip to Content
Technical Articles

HTML5 Applications Managed by SAP Cloud Platform – The new way of developing HTML5 apps

Note that this asset was created before our branding changes related to SAP technology were announced on January 2021. Note that SAP Cloud Platform Launchpad was renamed to SAP Launchpad service, and SAP Cloud Platform Portal was renamed to SAP Cloud Portal service

There were plenty of changes in SAP Cloud Platform since last month. Some of the services were renamed or superseded with new services. You will most of the updates in the “SAP Cloud Platform Service Description Guide”. Some of these have direct impact on the decisions which need to be made when developing HTML5 applications which are accessed via a Fiori Launchpad on SAP Cloud Platform. This has been one of the most common discussions I have been having in the last few weeks. In this blog, I hope to clear some of the confusions and outline the available options when developing HTML5 apps.

 

Building a central Launchpad using SAP Cloud Platform Launchpad

Part 1 – Getting Started

Part 2 – Understanding the options around developing HTML5 apps in Cloud Foundry

Part 3 – Developing HTML5 apps

Part 4 – Integrating HTML5 apps with the Central Fiori Launchpad

Part 5 – Integrating 3rd Party apps with the Central Fiori Launchpad

Part 6 – Integrating chatbots with the Central Fiori Launchpad

Part 7 – Integrating with remote content providers

 

Application Runtime:

When developing HTML5 applications in SAP Cloud Platform (Cloud Foundry environment), you always needed a subscription to “SAP Cloud Platform Application Runtime”. This not only allows you to deploy HTML5 apps, but also apps based on nodejs, Java, Python etc.

Few weeks back, there was an announcement of a new service called “SAP Cloud Platform Extension Factory, Application Runtime” which supersedes this service. That is a long name for a service.

So what’s the difference. Some of the key aspects have been documented in this blog post “Redesigned SAP Cloud Platform Extension Factory, application runtime“. It was mainly around the simplification of this service across all hyperscalers. What you would notice, is that the new service includes some of the underlying capabilities without any quota restrictions (as shown below).

When you build and deploy your HTML5 apps, these apps are usually accessed via an application router. These apps get deployed within the space of a subaccount. In the “Applications” menu, you will be able to see the application routers which will help consume the contents which are deployed into the HTML5 application repository.

As per the documentation – “An application router serves static content from HTML5 application repository, authenticate users, rewrite URLs, and forward or proxy requests to other micro services while propagating user information. “

When you navigate to the “Service Instances” you will be able to see the HTML5 Application Repository along with the connectivity & destinations which are used by the application.

This is an approach which we have been following to build HTML5 applications for a while.

 

HTML5 Applications Managed by SAP Cloud Platform

Recently, SAP introduced a new option to build HTML5 apps.  With this new option, you no longer have to deploy your apps with your own application router. Its all managed by SAP as a service.

As per the documentation, here are the benefits of using this approach.

  • Simplify and speed up your development and deployment experience
  • Save resources by running a serverless HTML5 application, which doesn’t require any application runtime
  • Lower maintenance efforts by leveraging the most up-to-date routing capabilities
  • Meet the changing demand for HTML5 applications by automatically adjusting the service to maintain consistent and predictable performance

SAP recommends using the standalone Application Router only in advanced cases, for example when application router extensibility is required.

Note that applications which are deployed using this method will no longer show up within the spaces. This will be in the “HTML5 Applications” menu at the subaccount level.

Most importantly – to use the “HTML5 Applications Managed by SAP Cloud Platform”, you need to subscribe to either SAP Cloud Platform Portal service or a new service called “SAP Cloud Platform Launchpad service”.

Going forward, as part of new engagements – if you are going to either build new HTML5 apps or leverage a Fiori Launchpad on SAP Cloud Platform – ensure you have the below services:

  • SAP Cloud Platform Launchpad service
  • SAP Business Applications Studio
  • Bandwidth
  • Custom Domains (Optional)

In the next blog post, I will walk you through the steps which are required to develop a HTML5 app managed by SAP Cloud Platform and how it can be integrated into a central Fiori Launchpad.

 

10 Comments
You must be Logged on to comment or reply to a post.
  • Thank you for the blog post. I have been telling to myself, why are that HTML5 Applications tab on subaccount level and couldn`t find any info how to make them appear there.

    I thought that it has to do something with the SaaS service to exposure that app.

     

  • Thank you for this blog post.

    I was wondering how I could put my HTML5 app at the subaccount level as I was seeing the section in the left panel.

    Now I have my answer !

  • HI Murali,

    Thanks you for the blog and step by step process of understanding how to build the central launchpad.My question here is, I am not able to see my HTML5 application deployed as "Standalone Approuter",on could foundry in Launchpad Content Provider.As you mentioned i need to change the Approuter as "Managed by SAP  Cloud Platform ", but how can i change it in my existing application.Please guide.

     

    Thanks

    Ishita

  • Hi Murali,

    This was a great blog.

    We have two Fiori HTML5 applications in Launchpad up and running. Our customer wants to use Custom Domain to make it more easier to remember the Launchpad URL also in internal marketing etc.

    Since Fiori Apps can be seen under subaccount in HTML5 Applications, we don't have anything under Spaces. But still Custom Domain requires applications to be available under Spaces. When trying to Map the Fiori application to Custom Domain I get error Application not Found.

    So as a summary with this approach we are only able to create Custom Domain to all other types of applications except Fiori HTML5. Is this correct assumption?

    So far I have not found a good example how and why would anyone need to use Custom Domain if Launchpad is in use. Nor have I found any example how to map launchpad URL to Custom Domain.

    Thanks,

    Br

    Mikko

  • Hi Murali,

    thank you for the blog.

    One question: I always thought that when we do side-by-side extensions (Apps) for S/4HANA Cloud, that these Apps will be developed in SCP and then also run there, and will be "somehow" integrated into the S/4HANA Cloud Launchpad.

    Now I found this guide which describes, that you can deploy your app directly to the UI5 ABAP Repository of the S/4HANA Cloud System. The app would then not run in SCP?

    https://help.sap.com/viewer/841f379acd104dbf8685b3ad26e66af3/SHIP/en-US/eb4fdebfa9e442ea96b725fa4f894ae3.html

     

    Can you explain this? I think it would be a major change to be able to deploy to the S4HC backend system.

     

    Thank you

    Johannes

    • Hi Johannes,

      I haven't been following the updates on the S/4HANA Cloud. As per this guide, you can deploy the app directly to the backend system.

      One of the challenges which I have heard from S4HC customer is that extension apps are built in a FLP on Cloud Platform and the remaining standard apps are in S4HC FLP. May be this feature was introduced to support a unified access.

      Also, for S/4HANA systems, I see there is now an option to also consume custom Fiori apps deployed on Cloud Platform within the S/4HANA FLP. https://help.sap.com/viewer/ad4b9f0b14b0458cad9bd27bf435637d/Cloud/en-US/48ff1b03f65f4661b642255881c5e890.html

  • Hi Murali,

    Thanks for the elaborated blog. Really helpful.

    We have developed and deployed an Fiori Application - Freestyle UI5 Application through BAS.

    We are using Managed Approuter. The deployed application is visible in the Cloud Foundry - Space - Instances with (Destination, AppHost, Authorization app).

    But this Application is not visible in Subaccount HTML5 repository or Space - Application repository and neither in Portal Service - Content Provider (saas-approuter).

    We need to add this deployed app to our Portal service at subaccount level and as the application/router not available in any TML5 repository we are not able to add the app.

    Can you please advise if any imp step is missed here which will integrate the application from the Instance to the HTML5 repository (Specially the subaccount HTML5 repository or Content Explorer of portal service)?

    Thanks,

    Smita Thorat