Enabling Cache Buster for SAP NetWeaver Portal components based on SAPUI5

Hi all,

There are many ways how to create SAPUI5 applications. In one of our projects we came across a situation where the data which should be displayed or modified in the SAPUI5 component was retrieved from a SAP NetWeaver Portal, only. Therefore we decided to create a PortalAbstractComponent which will be the basic container for the SAPUI5 component to be displayed. Meaning, the PortalAbstractComponent includes a JSP or HTML which will implement the SAPUI5.

How to implement/call a SAPUI5 component from any HTML can be found here:

https://sapui5.netweaver.ondemand.com/#docs/guide/3da5f4be63264db99f2e5b04c5e853db.html

We then created an iView from the PortalAbstractComponent and added this to a user role. The SAPUI5 was displayed as expected and all worked fine.

But somewhen we needed to change the SAPUI5 due to a change request. And now we recognized that caching was an issue. All changes to client side files (such as JavaScript or View XML files) were not visible to the end user without deleting the browser cache. We checked various SCN and SAP Help entries and found following entry for the SAP Cache Buster in SAP Help:

https://help.sap.com/saphelp_nw74/helpdata/en/ff/7aceda0bd24039beb9bca8e882825d/frameset.htm

Unfortunately, this SAP Help entry is not very precise when it comes to SAP NetWeaver Portal applications. It can be used for standard JEE applications but not for Portal applications based on AbstractPortalComponent. The problem with such Portal applications is that for those applications you can’t modify the web.xml. But according the SAP Help you need to add some filter here.

That’s why we create this blog to describe how to create a Portal application implementing SAPUI5 and using the SAP Cache Buster.

For the impatient in short – create two new projects:

• a J2EE Web Module project containing the custom SAPUI5 resources and the modified web.xml
• a J2EE Enterprise Application project needed as transport container to deploy the Web Module

The Portal Application Project will only contain the Java Resources retrieving the data and initializing the SAPUI5 resources. For initializing the SAPUI5 resources we added following the the

Replace “” with the according theme ID.

Now create a J2EE Web Module project and paste all custom SAPUI5 files below “WebContent” folder. Thereby following files must be placed directly below the “WebContent” folder:

• Component-preload.js (if used)
• Component.js
• manifest.json

All other files can be structured in sub folders as needed.

Modify the web.xml of the Web Module project located below “WebContent > WEB-INF” as described in SAP Help

https://help.sap.com/saphelp_nw74/helpdata/en/90/a0e440cdc143a48c0a5b395dcb7828/frameset.htm

As the Web Module can’t be deployed you need to create a J2EE “Enterprise Application” Project. Here you need to reference the Web Module project.

In order to call the custom SAPUI5 within the Web Module we added a

 sap.ui.getCore().attachInit(function () { var resource = {}; resource.url = "/"; resource.final = true; jQuery.sap.registerModulePath("my.custom.SAPUI5", resource); sap.ui.core.AppCacheBuster.register(resource.url); new sap.ui.core.ComponentContainer({ name : "my.custom.SAPUI5" }).placeAt("someDivId"); });

The “resource.url” must point to the basic web path of the web module. It must not point to any subfolder as the SAP Cache Buster only checks the root path for an application.

As we have multiple portal components using SAPUI5 we register each SAP Web Module for the SAP Cache Buster using:

sap.ui.core.AppCacheBuster.register(resource.url);

If we now deploy the Portal Application Project and Enterprise Application project the Cache Buster is working as expected.

Additionally: You do not need to create a file “sap-ui-cachebuster-info.json” as indicated by the SAP Help. This file will be generated automatically by the Cache Buster.

Hope, this helps if you need to create Portal Applications using SAPUI5.

regards

René