With today’s update on the trial landscape we have an option to deploy lightweight HTML5 apps on the SAP HANA Cloud Platform. Under the tabs for HANA XS Applications and Java Applications you see now an additional tab called HTML5 Applications.
I’d like to show you in a short video how you can leverage this functionality to create a small sample SAPUI5 app which connects to a public weather API. It’s not intended to be used in productive environments, but rather helps you understand the concepts with a useful application.
While watching the video you can follow all the steps I’ve described below.
But first I’ll explain what this sample app is about I’m using to show you the functionality of the HTML5 Applications on SAP HANA Cloud Platform.
The code for the app
You can find the code for this small app in the listing below for the file index.html. The code for the SAPUI5 app consumes the API of openweathermap to get the current weather of a city. In this case you’ll get the current weather in Lisbon and the city of Neustadt an der Weinstrasse which is defined in row 81 and 85 of this app.
The access to the API is not done. Instead we are using the path /openweathermap (also in line 81 and 85) which is mapped to a destination called openweather. The mapping between the path and the destination is done in a file called neo-app.json.
The neo-app.json file
The neo-app.json file needs to be deployed in the same folder as the index.html file. It creates the connection between the path we want to use to access the API (/openweathermap) and the destination configuration we have to configure in the Destinations panel of your trial account on SAP HANA Cloud Platform Cockpit.
With this file you tell the dispatcher for the HTML5 apps to re-direct all calls on /openweathermap to the destination openweather.
The destination configuration for openweathermap
The destination describes now where the resource is that the application is looking for. The name of the destination needs to map to the name defined in the neo-app.json file above. So in our case it’s openweather. You can find the file content in the listing at the end of this blog post called openweather.txt.
Later on you simply import it as destination in the Destinations panel on your account.
How to deploy the app on SAP HANA Cloud Platform
Creating the HTML5 app in the cockpit
- Open your cockpit for your trial account on SAP HANA Cloud Platform
- Create a new HTML 5 App in the tab HTML5 Applications
- Click on the name of the newly created app
- Click on the tab Development and copy the link of the Git repository to your clipboard
Accessing the Git repo and pushing all files to Git
- Start Eclipse and switch to the Git perspective
- Click on “Clone a Git Repository“
- Paste the Git-URL you’ve copied from your cockpit into the URI field of the popped-up window, provide your user name and password of your SAP HANA Cloud Platform trial account into the fields User and Password, click on Next, click on Next again and click on Finish.
- Now right click on the Git repository and select the command Import Projects
- Select Import as general project, click on Next and after that on Finish
- Switch to the Web perspective in Eclipse
- Create a file called index.html and copy and paste the code from the listing below for the index.html file into that file and save it
- Do the same for the file neo-app.json. You get the source for that file from the listing below for the neo-app.json file
- Right-click on your Eclipse project and select Team and Commit
- Provide your credentials
- Provide a short commit message and select both files in the box below so that are selected
- Click on Commit
- Right-click on your Eclipse project and select Team and Push to Upstream
- Provide your credentials
- Click on OK
Creating the destination and deploying the app
- Now switch back to your cockpit for your trial account on SAP HANA Cloud Platform
- Select your HTML5 app
- Click on the tab Development
- You’ll notice that there is a new commit listed up with the comment you’ve provided before
- Now create the destination
- Switch to account level on your cockpit and click on the Destinations tab
- Click on New Destination
- Click on Import from File and import the destination as a file with the content of the listing below for the file openweather.txt
- Save it
- Click on the tab HTML5 Applications
- Click on the name of the your app
- Click on the Development tag
- Click on the link of the commit message
- Your app shows up now and should show you the current weather in Walldorf
- This link is only accessible to you as a developer
Provide others access to your app
If you want to make your app externally accessible you need to create a version of your code, activate it and start your app. This is what you’d have to do:
- In the list of available commits select the commit that you want and click on the “Create Version” icon at the right end of the line
- Provide a version name like 0.1 and click on Add
- Now switch to the tab Version Management
- You should see the version you’ve just created before
- Now click on the icon at the right end of the line to Activate this application version
- You get a message telling you that the version has been activated and that the Changes will be effective after (re)-start of the application. Confirm the question if you really want to do this with by clicking on Yes.
- Switch to the HTML5 Application Dashboard and click on the Application Url
- This is the URL under which others can now access your app
In the video you can see a few more things that you can do with HTML5 apps on SAP HANA Cloud Platform as the easy versioning of commits as well as the activation of the different versions of your HTML5 app.
Let the party begin
So now that this is working why not adding an additional tile which retrieves information from another source? Add another “route” to the neo-app.json file and an corresponding additional destination. Share your ideas on SCN.
Hope you enjoy using it.
Code for file index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge” />
<title>Lightweight HTML5 apps and Git on SAP HANA Cloud Platform</title>
<script src=”/sapui5/sap-ui-core.js”
type=”text/javascript” id=”sap-ui-bootstrap”
data-sap-ui-libs=”sap.ui.commons, sap.suite.ui.commons, sap.m”
data-sap-ui-theme=”sap_bluecrystal”>
</script>
<script type=”text/javascript”>
// #####################################
// Model – Start
// #####################################
var getModelFromURL = function(url) {
var url = url;
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData(url, null, false);
return oModel;
};
// Model – End
// #####################################
// Views – Start
// #####################################
// builds the main page
var buildMainPage = function(id, title, content) {
var page = new sap.m.Page(id, {
title : title,
showNavButton : false,
content : content
});
return page;
};
// builds the weather tile
var buildWeatherTile = function(id, oModel) {
var tile = new sap.m.StandardTile(id, {
numberUnit : “Celsius”,
infoState : “Success”,
press : function() {
var link = “http://openweathermap.org/city/” + oModel.oData.id;
window.open(link, “_blank”);
},
tap : function() {
var link = “http://openweathermap.org/city/” + oModel.oData.id;
window.open(link, “_blank”);
}
});
// Bind weather icon
tile.bindProperty(“icon”, “/weather/0/icon”, function(bValue) {
return “http://openweathermap.org/img/w/” + bValue + “.png”;
});
tile.setModel(oModel);
// Bind name of city to the tile title
tile.bindProperty(“title”, “/name”, function(bValue) {
var longTitle = “Current weather in ” + bValue;
return longTitle;
});
// Bind weather details to info field of tile
tile.bindProperty(“info”, “/weather/0/description”);
// Bind temperature to the number field of the tile
tile.bindProperty(“number”, “/main/temp”, function(bValue) {
// We want Celsius
var degreesCelsius = Math.round(bValue – 273.15);
// Also add the Celsius sign to the temperature value
//Switch to Fahrenheit
//var degreesFahrenheit = Math.round(((bValue – 273.15) * 9/5) + 32);
//return degreesFahrenheit + “\u00b0”;
return degreesCelsius + “\u00b0”;
});
return tile;
};
// Views – End
// #####################################
// Main SAPUI5 application – Start
// #####################################
var idPageMain = “main”;
var app = new sap.m.App(“myApp”, {
initialPage : idPageMain
}); // page1 should be displayed first
// Create a tile for the current weather in Lisbon
var oModelWeatherCity1 = getModelFromURL(“/openweathermap?q=:Lisbon”);
var weatherTileCity1 = buildWeatherTile(“myWeatherTileCity1”, oModelWeatherCity1);
// Create another tile for the current weather in another city
var oModelWeatherOther = getModelFromURL(“/openweathermap?q=Neustadt an der Weinstrasse”);
var weatherTileOther = buildWeatherTile(“myWeatherTileOther”, oModelWeatherOther);
// Now create the page and place it into the HTML document
var mainPage = buildMainPage(idPageMain, “Lightweight HTML5 apps and Git on SAP HANA Cloud Platform”, [weatherTileCity1,weatherTileOther ]);
app.addPage(mainPage);
app.placeAt(“content”);
// Main SAPUI5 application – End
// #####################################
</script>
</head>
<body class=”sapUiBody”>
<div id=”content”></div>
</body>
</html>
Code for file neo-app.json
{
“authenticationMethod”: “none”,
“routes”: [
{
“path”: “/openweathermap“,
“target”:
{
“type”: “destination”,
“name”: “openweather“
},
“description”: “OpenWeather System”
},
{
“path”: “/sapui5”,
“target”: {
“type”: “service”,
“name”: “sapui5”,
“entryPath”:”/resources”
},
“description”: “SAPUI5”
}
]
}
Code for the destination file openweather.txt
Name=openweather
URL=http\://api.openweathermap.org/data/2.5/weather
ProxyType=Internet
Type=HTTP
CloudConnectorVersion=1
Authentication=NoAuthentication
UPDATES
June 10th, 2014
You might want to check the blog post from Ankur Kumar around ESPM Webshop on light weight HTML5 applications. Good read and goes far beyond my simple example in this blog post.
Jul 9th, 2014
Based on the feedback of a colleague today (thanks Tobias!) I’ve cleaned-up the code in the index.html a bit and also provided some pattern you can use to create additional weather tiles.
Best,
Rui
Thanks for sharing Rui.
I hope this is the first step to doing real app deploys via git/maven. Would be so much more efficient (not to mention faster) for HCP to do maven build of application from a git url.
Any which way, it’s cool!
What will be the limit on number of HTML5 applications that can be deployed on a trial account?
Cheers,
Chris
Thx Chris. Not sure about the limitations, but I’ll ask the colleagues to jump-in here.
Rui
The limitations are:
– max 100 MB per trial account (summing up all repositories)
– max file size 20MB (to avoid performance issues with large files)
The number of repositories is unlimited.
Note that currently deletion of git repositories is not yet possible.
Stefan
Great stuff Rui, really nice and clear (btw did you realise the YouTube video still has status “unlisted”?)
This is the perfect storm of tech (at least for me) – hosting, UI5, git and proxying. Thanks to the SAPHCP team!
Thanks DJ for the hint. I wasn’t sure whether the audio was good enough, so I could substitute the video in my blog post with a new video with improved audio.
Rui
I’ve just fixed the sound issue and uploaded a new version of the video which is listed now as “public” on youtube.
Rui
This is so utterly cool, I may want to kiss you and the HCP team!
Like Chris, I hope this is a step forward to (full?) Git/Maven integration, and seeing this I am quite hopeful it will eventually happen!
Keep up the good work and progress!
Bedankt Robin! đŸ™‚
On Mac (and other flavors of Unix) you should set core.filemode=true
or leave out this setting since true is the default [1]. Also git is auto-detecting
this parameter when you are cloning or initializing a repository.
[1] https://www.kernel.org/pub/software/scm/git/docs/git-config.html
Pretty cool.
Are there plans to use git for other programming languages as well?
Are there size limits regarding the amount of code that I can store in my git repositories?
D.
Thx Dick! Not sure about the limitations on the Trial landscape. I’ve asked the colleagues from the development team to add a comment to your question.
Best,
Rui
For trial accounts the quota is max 100 MB storage in total for all repositories owned by a trial account.
The limitations are:
– max 100 MB per trial account (summing up all repositories)
– max file size 20MB (to avoid performance issues with large files)
The number of repositories is unlimited.
Note that currently deletion of git repositories is not yet possible.
Stefan
Thanks, Rui. Nice blog. Excellent to see HTML5 and Git integration working well.
Thanks for putting this together, Rui! Nice video and blog!
Sascha
Much bigger thanks are going to the team that put this great enhancement on SAP HANA Cloud Platform!
So thx Martin Hermes, Matthias Sohn, Stefan Lay, Sascha Scholz and all the others to provide this on our great platform. I love it!
WIll also show more details in the new openSAP course ‘Next steps in SAP HANA Cloud Platform’
Rui
Hi Rui,
great stuff! Thanks for sharing this.
Best regards
Renald
You are welcome. Although I’m pretty busy with the recordings for the new openSAP courses I HAD to write this blog. I really, really like this new feature.
Rui
Great feature!
Allthough I’ve imported the destination file I can’t get the destination in html5applicon/development to be available.
Any ideas.
Regards, Gulli
Same here…. The destination shows a red square saying: “Required destination is not available. Deploy the required destination to use the application”… There is no “deploy” button or link anywhere for destinations though and I added the neo-app.json file as explained…??
To “deploy” the destination, navigate back to the account level (by clicking on the account name in the Focus Object area on the left side), then navigate to Destinations.
Hi Sascha, I have done that a few times but when you see the destinations window there is no button or capability to “deploy” the destination. I only have edit, clone, export (to file) and delete with the saphcp trial.
Hm, it should be there. Could you please try to follow the steps Rui shows in his video starting at around 8:50?
Have followed both the video and written instructions. Have deleted and re-created the destination twice.
Have also done this on two diff computers (windows/mac).
There is absolutely, positively no button or link to “deploy” a destination.
Just cloned the repo again and checked – the json file is exactly the same as the copy attached to this blog; so its definitely there. I don’t see any “deployment” step in Rui’s video either…. ;-(
fyi. The fix mentioned by Vasil further below in the comment stream has sorted this issue. đŸ˜‰
We are checking the issue and will get back to you soon.
Sorry for the trouble.
Rui
Hi Rui,
The issue is with the Destination Editor and affects just some old accounts. We are already providing a hotfix for it and I’ll notify you here when it is available on Trial.
Regards,
Vasil
Thanks for letting us know… There have been a number of issues over time that have only effected your “old” accounts.. Why is that? Us “old” account holders are your best evangelists of the platform!
The fix is available now, so all should be fine.
Regards,
Vasil
Thanks Vasil, the fix deleted the existing destination but upon recreating it, all is good. Thanks for sorting it out so quick!
Hi Rui,
Thanks for a excellent blog .
we have developed one Odata service which is available in company network .
we have exposed that service to internet through web dispatcher.
we have both http and https url for this .
we are consuming the service through https url in an SAPUI5 application deployed in Hana Cloud Developer Trial instance .
we are getting cross origin error fro this.
how ever we have developed one servlet to avoid the cross origin error .
but while we are trying to call the https url through the servlet we are getting an error
Target not allowed
please help us with the issue .
as well as please let us know ,is there any otherway we can avoid the cross origin error .
Tanks&Regards
Dibyajyoti Nanda
Hi Dibyajyoti, have you added the destination to your Destinations panel of that SAP HANA Cloud Platform account and created the correct routing in the neo-app.json file as I described and showed in the video inside this blog? That should do the trick.
Best,
Rui
Hi Rui,
Thanks for your suggestion.
I have tried all the steps as per your suggestion.
but I am getting below error.
FYI….
Below is the url i am calling from my code
var localservice = new sap.ui.model.json.JSONModel();
$.ajax({
url: “/myservice/ServiceOrderCollection/?$format=json /”,
contentType: ‘application/json; charset=utf-8’,
type: ‘GET’,
dataType: ‘jsonp’,
error: function (xhr, status) {
alert(status);
},
success: function (result) {
console.log(result);
localservice.setData(result);
}
});
json file
———–
{
“routes”: [
{
“path”: “/myservice”,
“target”: {
“type”: “destination”,
“name”: “ZSERVICEDEST”
},
“description”: “OpenWeather System”
}
]
}
I have activated basic authentication for this destination .
we are trying to replicate below url in which we are getting the data
the bold section is the configured destination url
http://mydomain.com:447/sap/opu/odata/sap/ZSERVICEMANAGER/ServiceOrderCollection/?$format=json /
please suggest
Thanks&Regards
Dibyajyoti Nanda
HI Dibyajyoti,
if you are using https try adding the property TrustAll=TRUE to your destination.
Best Regards,
Martin
Hi Martin,
Thanks for your input.
I have tried by adding the property as per your suggestion on https url .
I am getting status code
= 1
and authentication type =basic authentication
along with username and password
so please clarify, Is cloud connector is compulsory to consume url in cloud ?
please let me know if I am missing any other steps in this development process.
Thanks & Regards
Dibyajyoti Nanda
Hi Dibyajyoti,
If you get a 403 now I would expect that this is send by your backend or web dispatcher, isn’t it? Can you test your service URL directly with a REST client and basic auhentication using the credentials you have provided in your destination?
Best Regards,
Martin
Hi Martin,
thanks for your input.
I am able to get data in rest client by using the https url and basic authentication .
Thanks&Regards
Dibyajyoti Nanda
o.k. Did you also check the log files in the web dispatcher?
HI Martin,
thanks again for your response.
we have checked the dispatcher the request generated from our project is not reaching to web dispatcher .but from rest client it is reaching .
here i am attaching one error screenshot FYR
i think the cloud server it self blocking the request.
please let me know your suggestion on this .
Thanks & Regards
Dibyajyoti Nanda
Hi Dibyajyoti,
could you please switch on the traces (link) for your application for package org.apache.http.* to ALL and rerun the test?
Please download and attach the log file afterwards for analysis.
Thanks, Timo
Hi Dibyajyoti,
could you please add the externally accessible url to this discussion? I like to make a test on my side to access the URL.
Thanks, Timo
Did you ever resolve this issue? I’m having the same problem.
Ross
Hi Rui,
Thanks for great blog.
This is my first effort on developing one HTML 5 app on HANA cloud platform.
however I got stuck on eclipse ->windows->preferences->git window .
I am using windows 64 bit machine.
I am putting my SAP I number and SAP machine password.When clicking next it gives an
error message.
It says Possible Reasons
1. Incorrect URL
2. No network connection
3. .git is missing
4. ssl host could not be verified…
Can you help me with that please ??
Thanks
With Regards
Adesh
Maybe you are behind a proxy, then you need to configure the proxy in Eclipse preferences click “Window > Preferences” and enter proxy settings under “General > Network Connections” for the https schema. See [1] for details.
[1] Help – Eclipse Platform
Hi Adesh,
I think you need to provide your scn password, not your SAP password.
Stefan
Thanks Stefen,
Yes you are absolutely correct , I have given SCN password and then I am able to connect with hana cloud instance as well as with GIT repository.
Thanks
With Regards
Adesh
Great stuff!
Git integration sounds really good, easy to use and it represents a really good choice.
Thanks for sharing.
Mirco
You are very welcome Mirco.
Best,
Rui
Thanks Rui,
I am great fan of you. This is great blog and helped me a lot.
Thanks,
Warm Regards
Hemendra
Happy that you find this useful. I was pretty busy with the recordings for the upcoming openSAP course, but when the HTML5 Apps functionality went live on the trial landscape I simply HAD TO write this blog so that others could also use it right away.
Best,
Rui
Great!
Excellent entry into the workfield đŸ™‚
Thanks and regards Matthias
Wow. Rui. You explained it so simple and to the point. I have a question. Thanks a lot.
– If I have to develop a UI5 application, and deploy it through SMP, is this the same way you do it?
– Why do you call it a lightweight? Is there any alternative approach for heavyweight?
Yes, the heavyweight way before HTML5 was to wrap your HTML5 sources into a WAR archive and deploy it on a Java VM in the HANA Cloud Platform, take care of scaling yourself, implement proxying yourself etc.
Good tutorial, I went through it without any issues.
I like the check for missing destination and corresponding notification via the red box.
Wouldn’t be useful if there is a direct link to the destination editor?
Hi Vlasislav,
Absolutely! That’s already on our list. Thanks for the feedback.
Best Regards,
Martin
Dear Rui,
do you know if HTML5 apps support also connections via the SAP Cloud Connector to a on premise system on the HCP trial accounts? I have the connector running and successfully made a connection via a Java application. XS applicaitons unfortunately don’t support it on the trial landscape: Connecting for XS app to an OnPremise service. I get the error message:
Cannot open tunnel with id account:///sXXXXXXXXtrial
In the Cockpit the Required Destinations for my HTML5 app show all green lights.
Best regards
Gregor
Hi Gregor,
you can access On-Premise systems via the SAP HANA Cloud connector from HTML5 applications. If it doesn’t work for you, there is obviously some erroreunous situation, that needs to be investigated.
Best regards,
Markus
I’m trying to add an extra tile , by calling the getWeatherTile function, but I only get an exact copy of my “Walldorf tile”… đŸ˜•
Anybody that can give me a hint ?
Hi Rolf,
If you call the method twice, you will just overwrite the model with the data from the second call. As both tiles are bound to the same model they display the same data. So you have to separate the data in the model for each city and bind the tiles to the corresponding entries in the model.
Best Regards,
Martin
Thanks Martin,
What’s the easiest way of doing that ?
Sending in the model as a parameter ? – Where are you DJ ? đŸ˜‰
Hi Rolf
Just bind the model to the tile. So remove the line
sap.ui.getCore().setModel(oModelWeather);
and add th line
tile.setModel(oModelWeather);
after the tile has been created
Good luck đŸ™‚
I guess you are all interesting in weather forecast for Mandal, Stord and Kristiansand ? đŸ˜‰
Interesting fact of the day: Today SAP announced its new SAP River Rapid Development Environment. Have you tried it out yet and payed attention to the URL? It will look something like this:
https://rde-somenametrial.dispatcher.hanatrial.ondemand.com/
It is actually an HTML5 application running on the new HTML5 infrastructure served from a GIT repository on HANA Cloud Platform đŸ™‚
SAP Web IDE – Overview
Hi Experts,
I have follow the step that mentioned under this blog.
When i Commit the into the Git its gives the “Not Authorization error”
“https://git.hanatrial.ondemand.com/xxxxxxxxxxxtrial/myapp1312: not authorized“
Please suggest me how to remove this error.
How i can get the access of Git Repository login details from SAP?
Many Thanks,
Mithun
Hi Mithun,
you need to provide your SCN username and password when you push to the git repository. If you select the check box “Store in Secure Store” you do not need to enter your credentials anymore when you push again.
Best Regards,
Stefan
Use your SCN user for accessing the git server.
Commit is a local operation creating a new version in your local clone of the repository which resides in your private workspace and does not require authentication to the central git server at https://git.hanatrial.ondemand.com.
Can you please provide detailed steps to reproduce ?
hi Rui, very nice blog…Thanks for sharing…
Kind Regards
Ranju
Thanks Ranju!
Did you also already see this blog post here:
ESPM Webshop on light weight HTML5 applications
Very nice, too.
We’ll be able to show a lot of new and cool stuff at d-code this year đŸ™‚
Best,
Rui
Hello Rui, oh it is already out đŸ™‚ thanks…
we also have SHINE light weight UI5 application now, which we plan to release via GITHUB soon…
yes of course looking forward to D-code đŸ™‚
Hi Rui,
thanks for the great tutorial.
Is it also possible to use the openweather destination in a common xs application, deployed to the cloud (without using the HTML5 Applications feature)? I created a xs project in HANA studio, added your index and neo-app files and configured the destination, but opening the app in a browser results in a 404 error for https://xs<accountid>.hana.ondemand.com/openweathermap?q=walldorf... . Any suggestions?
Thank you and best regards,
Fabian
I also had 404 issue when I tried to deploy a SAPUI5 to a on-premise HAHA server. It seems that the neo-app.json not work.
Any idea on this?
Thanks!
Hi Fabian, Xu,
this HTML5 infrastructure is only available on the Hana Cloud Platform, not on Hana XS
Best Regards,
Martin
thanks ! brilliant work
Hello Rui, I found this article nice and easy, steps are very convenient as i have some experience in setting up the system ready like installing eclipse, installing sap cloud etc software, creating trial instance etc,
This is a first Html5 application i created through the sap hana cloud platform.
I recommend this article which explains all the required steps to configure setup and keep running your first free html5 cloud application.
I felt that i may not go through git perspective very easily but remembering the personal passwords makes lot of sense.(i made it well because i carefully followed this article)
For freshers working here also look into the SHINE or some sap hana examples from the eclipse right click in explorer import->sap hana content-> sample applications.
my html5 cloud application is here below
Lightweight HTML5 apps and Git on SAP HANA Cloud Platform
Thanks
Prashanth.
Hi,
The GIT URL for any apps looks to be down. What can be done?
https://git.hanatrial.ondemand.com/i070514trial/ssuiteapps
—
Regards,
Vinay
Hi Vinay,
this URL is not meant to be used in the browser, it can only be used for accessing it with a git client. Please try to clone your repository using this URL.
Best Regards,
Stefan
Hi Rui,
Very nicely explained and very clear steps.
Thanks much.
Farooq
…great blog!
Even with an trial account I cannot add/edit a destination after I pushed the app.
(You can also inspect my account for analysis – D063255)
Kind regards,
Daniel
…already solved: I could enter/upload the destination via the cockpit top level …after that the destination get valid (=green) and the API showed the right information from the API.
Hi Rui,
Thanks for the blog, I am learning SAPUI5 and other HANA development technology.
things are bit new for me.
I want to understand use of this file I mean how it is working execution time. “neo-app.json”.
I wrote an SAPUI5 program to consume Odata service, which is hosted in company network, there cloud connector is already installed, I can consume odata service with original url.( it require to disable the chrome web security). but using Cloud connector now I want to consume same virtual URL in our program so that we dont need to disable chrome web security.
Thanks
Sunil
Dear Sunil,
you can check out HTML5 app and SAP HANA Cloud Connector: Cannot open tunnel with id where I have included a sample neo-app.json with screenshots for my Destination Settings.
Best regards
Gregor
Thanks Gregor,
I check that link and I guess you have developed your app in HTML5 with git repository.
I just want to learn two things
1. What is this nea-app.json file, and how it work in HTML5 application with git project.
2. How can I do the same thing/make a connection with cloud connector with simple SAPUI5 application, which I will deploy in HANA account (this is not trial account).
like I said I can consume odata service with original url, however there is some browser security need to set to work with, but now how to use cloud connector setting I mean virtual URL to consume odata service in application, so that we dont have to remove browser web security.
Regards
Sunil Maurya
Great Blog i’ve implemented the app and modified it to show my current city weather, Amazing stuff !!! Thanks Rui đŸ™‚
Great Blog I did implement for the local weather and city of our corporate headquarters and it worked like a charm. There are few changes to the cloud plaftform cockpit what referenced in the article but it is not that hard to figure out. Thank you. đŸ™‚
Thanks Thareesh. Happy this blog post helped you to get started on HTML5 apps on SAP HANA Cloud Platform
Best,
Rui
Hi,
Thanks for a great blog.
By following your blog we created application and deployed in Hana cloud Platform.
Can you please explain how to subscibe HTML5 application in Hana cloud Platform.
We have a partner account. We created a consumer account and we can subscribe Java applications using Console Client. When we are doing same thing with HTML5 applications we are getting Path not found Error.
Any Idea on this?
Regards
Sridevi
Hi Sridevi, I think you’ve posted a similar question in the SCN Forum already (Not able to subscribe HTML5/SAPUI5 app in Hana cloud Platform).
And my colleague Martin answered that “as of today there are no APIs to create your own subscription candidates for HTML5 applications on HCP.“
Best,
Rui
Hi Rui Nogueira,
Thanks for your reply.
Using Hana cloud Platform we can create both Java and HTML5 applications. Like that we thought there is also a way to subscribe HTML5 applications for Partner account like Java applications.
Regards
Sridevi
Hi Rui,
I had a problem to consume the gwaas services in sap ui5 applications
Denise Nepraunig has suggested Matthias Schmalz for this problem but Matthias also do not have the idea.
below is the url for my post
please help out to solve this.
Regards,
Raghu Nookala
I suggeste Matthias Steiner –> Matthias Steiner’s Profile | SCN and not Schmalz.
Hello Rui,
Thanks for the blog (and also for the openSAP courses!) I am now trying to deploy my HTML5 applications.
I used WebIDE to develop and deploy my app. My app works fine after the first deployment. Later, I found out I needed to modify my XML view. I opened the view and modified it using WebIDE. Then, I deploy the changes into a new version (say version 2).
Now I have problem. When I run the active version (version 2) from HCP, HCP is showing me contents from version 1. It appears changes done in version 2 never went into HCP.
Now, I went back to WebIDE and run a test as web application directly from within WebIDE. This time I see the changes I did in version 2.
Going back to the active application link from HCP, I again see my version 1 even though version 2 is active.
Any idea on what did I do wrong?
Thanks and best regards,
Edi
Hi Edi,
you can check on the versioning panel in the cockpit whether your commit was deployed to HCP. Please check as well if a version is created on this commit and this version is the active version.
Martin
Hello Rui,
I see openweathermap api needs a key as applicable from 9th Oct. I assume a change will be required in the code.
Ref:# Frequent Asked Questions from openweathermap
Regards,
Ankit
Sample @Ankit Gupta:
Is it not possible to add weathermap API key to destination directly as a custom property ?
Hi Soujanya,
currently, it’s not possible to add the API key as a custom property to the destination.
Sascha
I have an exactly same requirement given in this article. I followed the steps but getting 404 error when i use destination for odata url . Please find my issues in the following post.
destination not working from neo-app.json after deploying from eclipse to HCP
// add appid
var appid = “&appid=2de143494c0b295cca9337e1e96b00e0”
// Create a tile for the current weather in Lisbon
var oModelWeatherCity1 = getModelFromURL(“/openweathermap?q=:Lisbon” + appid);
var weatherTileCity1 = buildWeatherTile(“myWeatherTileCity1”, oModelWeatherCity1);
// Create another tile for the current weather in another city
var oModelWeatherOther = getModelFromURL(“/openweathermap?q=Neustadt an der Weinstrasse” + appid);
apply this and it should work.
It works like this:
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData(“/openweathermap”,{“q”:”Singapore”,”APPID”:”YOURID“});
this.getView().setModel(oModel);
Replace YOURID with your app id.
Ross
I’m an HCP newbie. How do I pick up the App ID? I’m not sure where to find it.
Nevermind, I figured it out!
Thanks for this great post. It makes the start with HCP very easy.
Hi, thank you for this post, I am very new to the HCP, I am facing a problem that I couldn’t solve, and the other posts saying the same didn’t solve this issue.
I have copied the same text of the index.html and the neo-app.js showed above, I configured the destination as indicated too, but I get a 404 when calling the weather api because the url of the request is not correct, it makes a call to this url:
I see that the destination binding didn’t work but I have no idea how to fix it, I have tried to make the call to the weather api without using the destination config as follows (and it worked):
But with the once this one it just gives the 404 error:
When I am using URL like below..
I am getting error
Hey Rui and Community!
When I start the application I always get the following message:
Can anyone please help me with this?
I have no idea why it does not work.
Hope somebody had the mistake and can help me!
Kind Regards,
Nadine