Mobile SAP Portal

In the last years people are talking more and more about mobile access to SAP information. Today, in most cases people mean apps when they talk about mobile access. These apps are created for a device. You can have apps for Android iPhone / iPad or Blackberry, just to name a few. As apps are getting their data out of the internet, you could also use a mobile browser to access that data. Apps offer superior integration for the device, offline access and sync, but they also need maintenance. And they need to get developed, for every device. For online access, you can use the browser installed on the device to consult (or to approve) actual data.

As SAP has a strong position in this market – specially now with Sybase – there is one SAP product that almost never get’s mentioned when talking about mobiles: the SAP Portal. WebDynpro Java offers support for some mobile devices, but it doesn’t offer portal features like:

• portal profiles and user management
• navigation
• content management
• central place for maintenance

I want to share with you some screenshots that demonstrate that it is possible to access the SAP Portal and to interact with backend system. I used the device / browser simulators provided by Blackberry (OS 5) and Opera (Mobile 10). A “normal” user that logs on to the portal get presented with portal content.

It isn’t possible to run the same portal content on the mobile, the content administrator has to make sure that the mobile end-user will see only adapted content. Instead of creating a mobile only portal or mobile only users, the portal offers the desktop filter functionality for this. The same user can see different content based on the filter ID of the desktop.

Logon

The standard portal logon works also on mobiles, but it is too large for a mobile screen. I developed a simple HTML form that fits the small mobile screen.

Blackberry	Opera Mobile

Content

The SAP Portal has the Masthead for branding and logoff and the navigation for giving access to content. The SAP Portal offers access to content based on the user’s profile. Using the SAP Portal on a mobile ensures that this functionality is also available for mobile users. The standard masthead and navigation won`t work with the limited Javascript and CSS support of a mobile device. With my customized versions of the masthead and the navigation they will fit on the mobile screen. As the content get`s defined by the portal role, the content administrator can use the same tools as ever to assign content in the Portal Content Studio. For the examples here I used the Web Page Composer. You could also use the KM document iView and integrate a HTML document.

Blackberry	Opera Mobile
Start page with news to keep the user updated
Full news article

Mobile SAP users need access to backend information. There is no support for mobiles and Web Dynpro ABAP, but for Web Dynpro Java. Accessing a standard Web Dynpro Java iView of the SAP Portal results in no content being shown.

Blackberry	Opera Mobile
The iView gets loaded, but isn`t able to load the Web Dynpro Java application inside the iFrame.	The page loads with no content at all.

To be able to access Web Dynpro Java from a mobile device, you need to add a specific parameter to the URL. This parameter depends on your device. Distributing these parameters is easy when using the portal as a central access point. Only create a page with the link and assign the content to the user’s role.

When the user clicks the link to start the application, the necessary parameter is transmitted. As you can see, the same parameter renders different results in both mobile browsers. You need to experiment which parameter best works with your mobile browser.

Blackberry	Opera Mobile

Web Dynpro Java on a mobile gives you almost immediately mobile access to your data, but also brings limitations in regards to performance, layout and usability. Using the JCA of the portal, you can create your own portal applications that deliver mobile optimized content. For the following example I created a Portal Application that is using the datatables JQuery libray (http://www.datatables.net/) and their sample data.

Blackberry	Opera Mobile

The same portal application can be accessed by a mobile browser and “normal” desktop browser and renders the same results / functionality:

Internet Explorer (7)
Firefox (3.6)
Opera (10)

(These screenshots were taken from a standard installation and I made no modifications to the CSS. The JQuery application makes extensive usage of Javascript and AJAX).