Skip to Content

In this article, I describe how you can build an SAPUI5 (HTML5) app with SAP Web IDE to display your weather data from your weather station connected to the SAP Cloud. This article is based on my last article (Create your own Weather Station with SAP Cloud Platform Internet of Things). To have maximum fun, you should already have a weather station built and connected it to the SAP Cloud Platform Internet of Things in the Neo environment.

 

 

It is a good example to familiarize yourself with SAP Cloud.

This article is based in part on the Starter Kit for the SAP Cloud Platform Internet of Things.

 

Requirements

You need: SAP Cloud Platform Internet of Things and your weather station.

 

Create Destinations

Open the SAP Cloud Platform Cockpit in a browser and go to Connectivity > Destinations.

Choose New Destination and create two new destination.

iotmms

Is required to load the messages.

  • Name: iotmms
  • Type: HTTP
  • Description: IoT MMS API
  • URL: https://iotmms<YOUR-ACCOUNT>trial.hanatrial.ondemand.com/com.sap.iotservices.mms
  • Proxy Type: Internet
  • Authentication: BasicAuthentication
    • Enter your SAP Cloud Platform User and Password
    • User: <YOUR-ACCOUNT>
    • Password: <YOUR-PASSWORD>

iotrdms

Is required to load the device information.

  • Name: iotrdms
  • Type: HTTP
  • Description: IoT RDMS API
  • URL: https://iotrdmsiotservices-<YOUR-ACCOUNT>trial.hanatrial.ondemand.com/com.sap.iotservices.dms
  • Proxy Type: Internet
  • Authentication: BasicAuthentication
    • Enter your SAP Cloud Platform User and Password
    • User: <YOUR-ACCOUNT>
    • Password: <YOUR-PASSWORD>

 

Check the destinations. URL, User and Password must be correct. Note that Check Connection validates only the URL.

Import the Application in SAP Web IDE

Open the SAP Cloud Platform Cockpit, go to Services and click on the tile SAP Web IDE. If you have never used the Web IDE before, you may need to enable it first. Click Go to Service.

In the Web IDE click File > Git > Clone Repository.

 

Enter URL https://github.com/Cyclenerd/iot-consumption.git and click Clone.

 

Please ignore Git system files and click Do it later.

 

The application is now available in your workspace.

 

Deploy the Application to SAP Cloud Platform

If you want to run the application directly from the SAP Cloud Platform Cockpit, you need to deploy it into your SAP Cloud Platform account.

Right click your project folder in SAP Web IDE and choose Deploy > Deploy to SAP Cloud Platform. Follow the instructions of the wizard. Ignore the step for registering the application in the Fiori Launchpad.

 

After the deployment you find the application in the SAP Cloud Platform Cockpit under Applications > HTML5 Applications.

 

Open Application

The callable URL can be found in the SAP Cloud Platform Cockpit under Applications > HTML5 Applications > iotconsumption.

Click on the URL. Finished 🙂 Have fun with your new SAPUI5 application.

 

Pull Request Welcome 👍

Improvements to the UI5 app are welcome. Just send me a pull request: https://github.com/Cyclenerd/iot-consumption

 

I hope you enjoy discovering SAP Cloud.

To report this post you need to login first.

3 Comments

You must be Logged on to comment or reply to a post.

  1. PS GOSWAMI

    Hi Nils,

    First of all, I would like to convey a lot of thanks.. & would like to say, you brings a lot of hope to setup my first IoT use-case practically (if everything goes well :))!!!

     

    I have followed your Part 1 (except the Arduino – ESP8266 part.. yet to do) and now Part 2 as well.

     

    I’m able to store the values through MMS service as below but when I’m trying to use the application URL, its not showing any data.. Could you please help.. highly appreciated..

     

     

     

     

     

    NO value showing through Application URL.

     

    If you can clarify how to use the application data here in a simple way.. like we usually do while developing UI5 appliation (using service catalog or service url), that would be helpful…

     

    And how the below two service URL is connecting with the application data here..

    https://iotmms<YOUR-S-ACCOUNT>trial.hanatrial.ondemand.com/com.sap.iotservices.mms https://iotmms<YOUR-S-ACCOUNT>trial.hanatrial.ondemand.com/com.sap.iotservices.dms

     

    Eagerly waiting for your response.. Thanks again!

    Regards,

    Partha

    (0) 
    1. Nils Knieling Post author

      Hi Partha,

      Thanks for your nice feedback.

      You have done everything right. I had a small bug in this article. rdms URL was wrong. I corrected that.

      iotrdms = Is required to load the device information.

      Correct URL: https://iotrdmsiotservices<YOUR-ACCOUNT>trial.hanatrial.ondemand.com/com.sap.iotservices.dms

      iotmms = Is required to load the messages.

      No service catalog, etc.

      Should work with it. If not:
      Check the destinations. URL, User and Password must be correct. Note that Check Connection validates only the URL.

       

      Keep on having fun

      Nils

      (0) 
      1. PS GOSWAMI

        Thanks Nils.. Now its working..

        I will now try the end-to-end (with Arduino and Sensors)..

        Believe me … this two article will really boost the SAP ERP IoT enthusiast..

        Keep posting .. have fun!

        (0) 

Leave a Reply