Intro

Hi everyone, in this post I want to share with you some experiences about how to create news tiles with SAP HANA UI Integration Services (UIS). I installed SAP HANA SPS09 three months ago and have already tried lots of cool new features. Today I wanted to test something with UIS in SAP HANA Stuido. So when I created the "UIS Catalog" artifact and added a tile, I found there's also something new with UIS in SAP HANA SPS09.

As of SAP HANA SPS08, there's no news tile template in UIS. But as you can see in the following screenshot, in SAP HANA SPS09 now we have the news tile template which means we are able to place news tiles in the Fiori Launchpad in just few seconds. That's cool! "Custom App Launcher" is also newly introduced in SAP HANA SPS09, but I'm not going to focus on that in this blog post. Maybe I will show you something in another blog post.

What's UIS? & Some useful materials

As usual, first of all I wanted to show you some basics and useful materials about this topic, since perhaps for someone it's the first time to hear SAP HANA UI Integration Services (UIS) and I didn't plan to introduce everything in this post. So, what's UIS? I think the following slide page explained this clearly. As of SAP HANA SPS09, I think the killer feature is the capability of creating Fiori Launchpad inside SAP HANA.

Source

If you are new to UIS, you may have a look at the following materials first.

1. HANA UI Integration Services? What's that? You can learn some basics of UIS, but the examples are very old since standard application sites are deprecated as of SAP HANA SPS09.
2. http://help.sap.com/openSAP/HANA1/openSAP_HANA1_Week_06_Unit_02_UI_Integration_Services_Presentation.pdf A slide deck from openSAP, also get some basics and ignore the old examples.
3. Using UI Integration Services - SAP HANA Developer Guide for SAP HANA Studio - SAP Library
4. News Tile - SAP HANA Developer Guide for SAP HANA Studio - SAP Library
5. SAP HANA UI Integration Services (New and Changed) - What's New in the SAP HANA Platform (Release Notes) - SAP Library
6. SAP Hana UI Integration Services - YouTube Be careful. Some videos are very old, since widget and SAPUI5 application tile are deprecated as of SAP HANA SPS09.

Creating our first news tile

As its name implies, we can use news tile to display news feeds or we say RSS. In this section, let's start to create our first news tile and show it on our Fiori Launchpad step by step. I'm using SAP HANA SPS09 Rev. 93.

Step 1: Create XS project, as of SAP HANA SPS09, you can create .xsapp and .xsaccess together with creating the project.

Step 2: Create "UIS Catalog"

Select a wizard

Create new catalog, for simplicity I did not generate privileges.

Step 3: Add and configure the news tile

Add the news tile

Step 4: Add article feeds

Find a feed URL, e.g., we can choose one from http://scn.sap.com/community/feeds?community=2407

Add the feed URL and save it, see all configurations from News Tile - SAP HANA Developer Guide for SAP HANA Studio - SAP Library

Step 5: Create "UIS Application Site" - Fiori Launchpad

Select the wizard

Create new application site

Step 6: Grant the role

When launchpad.xsappsite is opened, you will see the following error.

How can we solve this? Granting the corresponding role. Since I wanted to show the error, I just granted the role in this step. You'd better do it at the beginning.

Now the error is gone.

Step 7: Create group and add tile

Create group

Add tile

Save and activate it

Step 8: Run Fiori Launchpad

Click "Runtime Version"

Login and the news tile didn't work, saying "No articles to display". You can use Chrome developer tools to find the issue in red box.

What happened? This is because of the same origin policy and the response header of our requested resource did not include "Access-Control-Allow-Origin". Are there any solutions? Yes, one of the solutions is called CORS. You can have a look at Cross-origin resource sharing - Wikipedia, the free encyclopedia and Cross-Origin Resource Sharing. That's why the following note is stated in News Tile - SAP HANA Developer Guide for SAP HANA Studio - SAP Library

If the URL references an external feed, the feed must be CORS-compliant. If the URL references an internal feed, the feed must originate from the same server and port as the launchpad.

Although there's no "Access-Control-Allow-Origin" in the response header, we can find a workaround from Fiori News Tile - no articles displayed. So, I installed Allow-Control-Allow-Origin: * - Chrome Web Store and enabled CORS. It worked and now we can get RSS feeds from all content of SAP HANA Developer Center.

Make more configurations

As you can see in News Tile - SAP HANA Developer Guide for SAP HANA Studio - SAP Library, there are some other configurations we can make in order to customize our RSS feeds. Since everyday I spend some time on SAP HANA Developer Center and SAP HANA and In-Memory Computing, and I love to participate in discussions about SAP HANA, I'd like to make my own RSS feeds.

As you can see in the above screenshot, I made three configurations.

1. Add my tile default image and set "Always Use Default Image" to true. I borrowed the image from Hana Maui | Escape to Hana, Maui
2. Add two article feeds. The first one is discussion feeds from SAP HANA Developer Center and the second one is discussion feeds from SAP HANA and In-Memory Computing You can find the links from http://scn.sap.com/community/feeds?community=2407 and http://scn.sap.com/community/feeds?community=2127
3. I want to focus on the discussions whose title includes "HANA"

That's it! No coding, only configurations, you got the Fiori Launchpad with your customized News Tile. Want to have more RSS feeds on SCN? You can have a look at Everything I know about... SCN RSS Feeds and configure your own.

Failed to start the app...

However, it seems to be an error when clicking the news tile. I found SAP Note 1968559 and 2065811 are related with this issue but don't know yet how to solve this inside SAP HANA.

Hope you enjoyed reading my blog and create your own news tile successfully!