Developing SMP 3 Mobile App using Appbuilder, Kapsel and SMP 3 Trial – Part 1
| Part 1 | Part 2 |
Part 3 |
Update: SAP’s recommended tool to develop SAPUI5 app is using SAP Web IDE. So I would suggest you to start with Web IDE instead of Appbuilder. More info: SAP Web IDE – Enablement
Today I have registered for SMP 3 trial available from SAP via SCN. So I spend few hours in developing a simple hybrid app. To make my life easy I used SAP Appbuilder also to develop my first hybrid app, Appbuilder helped me to design screens quickly with drag and drop feature. It also helped to deploy the UI5 app to devices via SMP 3 with a cordova container and SAP Kapsel plugins. For those who want to try the solution I am explaining the steps here.
Requirements:
Register for SMP 3 Trial, Registration – CloudShare Pro
Register for NWGW trial, http://scn.sap.com/community/developer-center/netweaver-gateway
Download and install SMP 3 SDK (tested with SMP 3 SP01) from Download and install Mobile SDK SP05 or SAP Service Market Place
Install Cordova in your system (version 3.1.0-0.2.0), Apache Cordova
Install SAP Appbuilder, SAP Development Tools for Eclipse
Install Android SDK, Android SDK | Android Developers
Configuring a Kapsel Application in SMP 3
1. Login to SMP cockpit in SMP 3 trial system > Click on “Applications” tab> click “New”.
2. In the new dialog window give the below details and click “Save” button. This will open a new dialog.
3. Under the tab “Back End” provide the end point url as http://sapes1.sapdevcenter.com:8080/sap/opu/odata/iwbep/gwdemo/ and leave the remaining field as by default.
4. Click on the tab “Authentication” and create a new profile with name “HTTP” (in the image it shows HTTP under existing profile since I created a profile earlier). Click on “New” button and select HTTP/HTTPS Authentication and click on “Create“, it opens a new dialog. Provide only control flag and url as given below and leave the other fields as by default. URL is http://sapes1.sapdevcenter.com:8080/sap/opu/odata/iwbep/gwdemo/
5. Click on the “Save” button.
6. Finally to test the backend connection, select the app connection and then click on “Ping“. The response will be a successful message as given below.
Was your backend url ready for use or did you in some way exposed it to sap webgui.Im really having a hard time on how to make my odata service visible in a browser.I dont have installed sap netweaver gateway and therefore i cant import them in sap service builder because i dont have authorization to create a project there.do you know any way to fix this in another way ?
In the example I am using NWGW trial, it has some sample OData services. I am using the Odata service http://sapes1.sapdevcenter.com:8080/sap/opu/odata/iwbep/gwdemo/ . Once you register for NWGW trial you will be able to use this service for testing. You can test this url from a browser that gives you the list of collections associated with the service.
If you don't have a NWGW you have to use toolkit for integration gateway (GWPA) to model the service and deploy it to integration gateway, this example might help you with it,How to use Integration Gateway with SMP 3.0 (Part 1)
Midhun VP
when i do ping for the new application this message pops up
Backend system cannot be reached:::Root cause:::Exception during connection execute:
Could you give details on the steps you performed.
The same steps you did anyway i made ping succesfully with another odata service but still in the second part i have problem with appbuilder connecting with the smp onboarding service,i read this have to do with google chrome and but still i couldn't find any solution for that.How did you fix this ?
Open the file datajs-1.1.0.min.js using any text editor (C:\appbuilder-1.0.1251\lib\onyx\util) and add the below code:
if (!Document.prototype.createAttributeNS) {
Document.prototype.createAttributeNS = function(namespaceURI, qualifiedName) {
var dummy = this.createElement('dummy');
dummy.setAttributeNS(namespaceURI, qualifiedName, '');
var attr = dummy.attributes[0];
dummy.removeAttributeNode(attr);
return attr;
};
}
if (!Element.prototype.setAttributeNodeNS) {
Element.prototype.setAttributeNodeNS = Element.prototype.setAttributeNode;
}
Midhun VP
Midhun VP
Do you know password of that windows server machine at cloud? By mistake, it has locked. 🙁
Use the option "can't access your account" 🙂 from login page.
I was talking about windows system locked out. It was asking some password. anyways i got it. I had to close the link and open it again.
Midhun VP
2 questions:
1. I followed the same steps and got one error while pinging the Application connection id in SMP cockpit (installed in my machine) but got this error Backend system cannot be reached:::Root cause:::Exception during connection execute:
Then i tried the same in SMP cloud and it did work. (what could be the reason for this error)? I am able to run this URL in my machine browser with valid id and password.
2. I tried to run AppBuilder in Chrome browser, after doing SMP settings (help menu) and when i click on "Retrieve" in "SMP connection profile" page, i dont see any kind of messages in Service and request section.
I have added the syntex as you mentioned in your previous reply.
Double check input once. Make sure you are using the public IP of your SMP 3 cloud, note that IP is dynamic so if you close the SMP cloud and reopens, it IP changes.
Check this from from a public network if the above didn't work.
Midhun VP
The network from which you are trying to connect is not allowing a connection to the mentioned service. So try it from a public network.
Midhun VP
yes, i have crosschecked everything once again. Public ip address is the same what i mentioned earlier. Do i have to comment this code of line?
But does it make sense to check/ping public ip in CMD?
Hi Jitendra ,
Are you able to solve the above error . Even i am facing the same issue. Let me any solution if you have have solved this.
Hi
I have a problem when I am testing my app in appbuilder's emulator.
As you can see below, when I develop my superlist I can see my data.
But when I choose run no data display.
Before After
How is it possible?
My service is created with Integration gateway and everything is exactly as your tutorial.
I don't have any other error.
Thank's
Could you add the key field on the screen and check. Ex. In a Odata service a field would be defined as key, in my example BussinessPartnerID is the key.
Midhun VP
I checked this but the problem still remains. I see the key in the preview of superlist but I can't see this in appbuilder's emulator.
Angeliki
Could you create a new application and check. I faced a similar issue, but after adding the key field to the superlist it worked. but not sure about the root cause.
ok I will create a new one!
In order to be sure, when you say key field you mean ID in my case?
No, I mean the field you defined as primary key when you created Odata Models using GWPA or the primary key in an existing Odata service. It can be the ID too if you defined so.
Ping failed with following message:
Hi Umang,
If you are accessing https external link through a proxy server, make sure you enable proxy detail as per below document How to configure SMP 3.0 to use proxy to access external resource
Rgrds,
JK
Hi Jitendra,
Thanks for the reply.Above document shows how to use the proxy...that I understood,but I dont know how to create that proxy.I am not aware of that.
Regards
Umang Patel
umang patel Are you using any proxy in browser under proxy server?
for Chrome>settings>Advanced settings>Change proxy settings>Connection>LAN settings
Yes Jitendra, its there.with address:proxy.xxx.com and port:8080
then you can set these proxies in the props.ini file available in server installation path (E:\SAP\MobilePlatform3\Server)
-Dhttp.proxyHost=proxy.xxx.com
-Dhttp.proxyPort=8080
-Dhttps.proxyHost=proxy.xxx.com
-Dhttps.proxyPort=8080
stop services and regenerate SMP Mobile device as discussed in the document.
Hi Midhun,
The link you have given of cloudshare is not working: Registration - CloudShare Pro.
Also not able to login when I directly go to cloudshare site.
Please suggest next step.
Thanks