HTTP Status 404-Not Found

[#1]

Hello Experts,

We have created UI5 application in WEBIDE using destination as SMP Integration Gateway. We are able to successfully run the application in webide portal. But when we deploy the application as SAP HANA CLOUD PLATFORM and if we try to open the deployed URL we are getting error

"HTTP Status 404-Not Found".

Please suggest!!

Regards,

Ashwin

[AshwinKatkar · Accepted solution]

Hi Azeez,

I have found the issue.

There were two issues.

1. SMP Server SP9 P4 is not allowing us to send request back to back end. So i have installed SMP SERVER SP9 only.

2. In our service there was one entity dont have data. Because of that is was not allowing us to create offline store.

Thank you for your support.

[michal_keidar]

You need to make sure the path to the app's index.html file is correct in neo-app.json under welcomeFile property. Notice that if this app was built during deployment then the path to the index.html should point to the file under the build target folder.

You can add a screenshot of your app's structure and its neo-app.json.

Regards,
Michal.

[AshwinKatkar]

Hi Michal,

Please find the details.

[michal_keidar]

You can see that the welcomeFile property references the index.html as if it was in the root of the app but it is actually in webapp folder. So it can't find it and gives the 404 error.

Fix the path according to the file's location: "welcomeFile": "/webapp/index.html"

[AshwinKatkar]

Hi Michal,

I have changed ti index.html path. Now it is not showing the 404 error, but now its showing the blank blue screen after deploying on Hana Cloud Platform.

Regards,

Ashwin

[michal_keidar]

And what is showing in the browser's console..?

[AshwinKatkar]

Hi Azeez,

Thank you for reply.

Actually the issue is like.

We have 2 gateway web services which resides on 2 different gateways.

We are able to create application from both of service as well as we are able create apk from that.

From these 2 services we are able to get in online mode means if we run the application in browser.

But if we run these in mobile device only one of them is able to create a offline store and display data on device. Other service is not able to create offline store in device and it shows blank screen.

I am attaching the metadata of both the working and not working web services.

Please have a look at it and let me know if there difference you can find in these service.

This issue is critical now it is holding us to from long time to move forward to production server.

Looking forward to your reply.

Regards,

Ashwin

Working Service.txt.zip

Not Working Service.txt.zip

[Abdul_Azeez1]

Hi Ashwin,

Let me pass these 2 services to my Colleague and get back to you soon.

Regards,

Azeez

[AshwinKatkar]

Hi Azeez,

Thank you for your reply. This help us to publish and run the application on Hana Cloud Platform.

But our final aim is to package this application as android apk. For packaging the application we are using HAT 1.11.4.

As endpoint we are using SMP Integration Gateway URL.  We followed the URL for creating the application.

During packaging the application it is giving us some errors as below.

[Abdul_Azeez1]

Hi Ashwin,

If your objective is to build a packaged application (.apk) and run on Android device, then you need to configure Application connection (Application ID)in SMP server and use the Application ID configured in SMP server in the Project Settings > Device Configuration and finally perform Run > Run On > Android Device menu.

The steps are

1. Configure Application ID on smp server

2. In Web IDE,  Project Settings > Device Confguration, configure the device configuration and specify the Application ID configured in Step 1

3. In Web IDE, select project, right-click and select Run > Run On > Android Device

Wait for the Cordova Project is created and build, install & launch the app on Android Device.

Please refe to the attached Create SAPUI5 Master Detail Kapsel Offline Application.doc as a reference.

Thanks,

Azeez

Master/Detail Kapsel Offline Application

Prerequisites

• Make sure you have an OData service which supports CRUD operations and the service has been configured as HCP destination to access it from SAP Web IDE.
• Make sure you have setup Hybrid App Toolkit environment (all prerequisites, including MobileSDK3 SP06) in your local machine. To setup Hybrid App Toolkit, refer to https://help.hana.ondemand.com/webide_hat/frameset.htm.
• You have started the Hybrid Toolkit Connector and is listening to port 9010
• You have configured an Hybrid Application in SMP3 Server based on the backend URL you are going to use to create the Offline Application

Step	Actions	Expected Results
	Enable “Hybrid App Toolkit” External Plugin
1.	Start SAP Web IDE
2.    Press Tools àPreferences menu		Preferences pane displayed
3.    Select Plugins à Optional Plugins in preferences pane
4.	In Plugin Repository, select “SAP Plugins”.
5.	Select to enable the “Hybrid App Toolkit plugin” and press “Save” button.	External Plugin is enabled
6.	Refresh the browser
	Create New Project based on SAPUI5 Master Detail Kapsel Offline Applicaion Template
7.    Press File à New à Project from Template menu		New Project wizard opened
8.    Select “SAPUI5 Mobile Applications à SAPUI5 Master Detail Kapsel Offline Application” template and press Next
9.	Specify a project name and press Next
10.	In Data Connection section, select “Service URL” and select “SMP IGW Service” for the  Service Information from the list
11.	Enter user credentials as smpAdmin/s3pAdmin when prompted	Service is connected and display the collections in the Details section
12.	press Next
13.	In Template Customization, fill-up the entries as below Project Namespace md (its optional) Master Section Title Product List OData Collection Product Search Placeholder Search Search Tooltip Search for items in list Search Field Name Master Data Fields Item Title Name Numeric Attribute Price Units Attribute CurrencyCode Detail Section Title Product Details Additional Attribute1 Category Additional Attribute2 ShortDescription Create/Edit Section Create Input for Key Columns Selected Information Section OData Navigation SupplierDetails Navigation Attribute1 SupplierName Navigation Attribute2 EmailAddress Navigation Attribute3 Country Press Next
14.	Press Finish	New Master Detail Offline Project is created and displayed in Workspace.
	Preview in SAP Web IDE
15.	Expand Project folder in Repository Browser
16. Select index.html and press Run à Run menu		Application Preview window open in a new browser tab
17.	When prompted for user credentials in Application Preview window, enter smpAdmin/s3pAdmin and click Logon.	Application loads the data in the Application preview view window based on the attributes configured in Template customization section
18.	Click on a List item in left-hand side	The right-hand side frame loads the detail screen based on the clicked row
	Configure Project Settings for  Hybrid Mobile App
19.	In SAP Web IDE, right-click on the project folder , select “Project Settings” context menu
20.	Select “Device Configuration” section in Project Setting
21.	Complete the device configuration with the following. Application Section App Name <specify a name> App ID <specify the app id configured in SMP3 Server> Description <enter some app description> Version 1.0.0 Platforms On Windows Select Android only On Mac Select iOS and Android (if you have both) Plugins Cordova Device, Network Connection Kapsel Logon Manager, Offline OData SMP Server Host <specify your SMP hostname or ip address> Port <specify your connection port> Note: Master/Detail Hybrid application retrieves data from SMP server and hence, Application ID needs to be setup on a SMP Server and the same Application ID needs to be specified in the Project Settings à Device Configuration.
22.	Press Save and Press Close in Project Setting Dialog		The project setting dialog is saved and closed.
	Run On - Android Device To run on Android device, Android device is connect to the laptop through USB cable You must have installed Google USB driver from Android SDK Manager.
23.	In Repository Browser, select the Project
24. Right click on the project and select Run à Run On  à Android Device menu			Web IDE issues a command to local Hybrid Connector server to create a Cordova project and Web IDE console display the log messages from the connector about the progress
25.	Project compiled and .apk file is generated, installed and launched on  Android device  In the launched application, SMP3 Logon Form appears as a first screen.
26.	Enter the following credentials to the SMP3 Logon Form in the application User smpAdmin Password s3pAdmin Security Config default And press Register button		Successfully registers the application to the SMP3 Server and Passcode screen appears
27.	Press “Disable Passcode” button and press “Submit” button		Successfully logon to the SMP3 server and the application’s Master page appears with Product List data
28.	Press on a row in Master page		Navigate to detail page displaying Product details and the Supplier  information
29.	Press Edit button in detail page		The product details page toggles to edit mode and display the Product data in an Edit Form.
30.	Change the product price and press Save button		Data successfully changed and toggle the detail page from edit mode to read-only mode
31.	Since the update is performed when the device in online mode, verify the changes in backend service
32.	Press Back button in Title bar		Page navigates back to Master Page.
33.	Press Back button on the Android Device (phone or tablet) until the application closed		Application closed and Android device home screen appears
	Run in Airplane mode – on Android Device (Offline mode)
34. In the Android device, choose Settings à Wireless and network à More settings
35.	Turn on Airplane mode in the more settings		Android device is now in Airplane mode
36.	Go back to the Home screen and run the application		The application now retrieves the data from Offline store and function properly as before (when it is in online mode)
37.	Press a row in Master page		Navigate to detail page displaying Product details and the Supplier  information
38.	Press Edit button in detail page		The product details page toggles to edit mode
39.	Update product in the edit page and press save button.		Data saved and toggle the page to read mode P.S. Since the device is in airplane mode, the data persist in the offline store & will be synced when device gets a connectivity.
40.	Press plus icon on Master page		Blank Product form in create mode appears in detail page.
41.	Add a new product data in the Product form and press Save button Note: Atleast enter values for ProductId,  Name,Price, SupplierId, CurrencyUnit columns		New product created in offline store.
42.	Verify the changes in the back-end data		The changes are not pushed to the back-end and hence the changes are not reflected in the back-end data
43.	Turn-off airplane mode in the device.		Device connected back to network (Wifi/3G/4G)
44.	Start the application again		Application started and pushed the changes persisted in the offline store to the backend.
45.	Verify the changes in back-end		Changes are available in the back-end now.

Appendix – A: Setting Up Gateway Service (IGW) on SMP3 Gateway Cockpit

If you have installed your own SMP3 (SAP Mobile Platform) Server in your local environment, then you will have SAP Gateway Cockpit icon added to your desktop.

The following steps describe the setting up an odata service on SAP Gateway Cockpit. Makesure you already started the SAP Mobile Platform service (SMP3 service)

1. Double-click on “SAP Gateway Cockpit” icon in the desktop. It will open the SAP Gateway Cockpit on the browser

2. Enter the admin credentials in the Gateway Cockpit logon screen and press Log On button.

3. Select “DESTINATIONS” tab in the cockpit and press “New Destination” button

4. Select “JPA” as destination type, “JPA” as destination name and “com.sap.espm.model” as Persistent Unit as below

5. Click “Save” button. The new destination “JPA” is added.

6. Select “SERVICES” tab and select the default “EspmService” to add a destination to this service.

7. Click the hyperlink “EspmService” in the service list. It will open the Service details dialog as below

8. Click “Add Destination” button and select “JPA” destination you added in step 4 and click “OK”. Click “Close” button to close the dialog.

9. Click “Open Service Document” link in the service list. This will open the service document in a browser. Enter SMP admin user credentials when prompted. It will list the service collections as below

This completes the setting-up of IGW odata service on SMP3 Gateway cockpit

Appendix – B: Setting Up Application on SMP3 Server

Make sure that you have added the certificate of the SMP3 Gateway server to the SMP 3.0 server before setting up the Application on SMP3 server.  To add a certificate, refer to http://danielva-xpvm.dhcp.oak.sap.corp/webworkflows/Getting_Started/index.html#odatademo

1. Logon to SMP3 Server admin console (https://<serverhost>:8083/Admin )

2. Click on the Application tab in Admin console

3. Click “New” button and fill-up the following in the new Application dialog

4. Click Save button. The Application detail screen appears.

5. Click “BACK END” tab and fill-up the backend end-point as https://<your smphost>:8083/gateway/odata/sap/EspmService;v=1/, as below

6. Click “Add” button in SSO Mechanisms section and add the “Technical User (Basic)” SSO mechanism as below.

7. Click “AUTHENTICATION” tab, select  Existing Profile tab and select “default” as Profile name

8. Click “Save” and click “Close” button.  It will return to the Applications list page and the created application appears in the list as below

9. Click the “ping” button to verify the back-end URL is reachable from SMP3 Server as below

This completes the steps to setup Application on your own SMP server.

[AshwinKatkar]

Hi Azeez,

We have followed the steps you provided. I am able to package the application as apk but after deploying it on mobile the screen on mobile is showing blank after registering the device.

I am using backend endpoint as SMP Integration Service.

Do you know why this is happening? Is there any way to check what is happening wrong.

Please take a look at the device config screen.

Regards,

Ashwin

[AshwinKatkar]

Hi Azeez,

I have checked the trace log does this make any sense in log. Please check the log.

#2.0#2016-02-04 03:37:36 AM#ERROR#RequestResponse###Other#1454576856285010#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.ApplicationConnectionHelper:processApplicationConnectionID########661#####The requested resource does not exist.#

#2.0#2016-02-04 03:37:36 AM#INFO#RequestResponse###Proxy#1454576856285009#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.proxy.configuration.service.AbstractEndpointConfigurationService:getEndpoint########661#####No endpoint with name POST_ip_port.php was found#

#2.0#2016-02-04 03:37:36 AM#DEBUG#RequestResponse#404##Client Request Trace#1454576856285011#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####<< Status Code: 404#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285008#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> pragma: no-cache#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285001#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> POST /POST_ip_port.php HTTP/1.1#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285004#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> content-type: application/x-www-form-urlencoded#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285006#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> host: 123.249.24.233#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285005#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> user-agent: Mozilla/4.0 (compatible; MSIE 9.0; Windows NT 6.1; 125LA; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022)#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285003#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> accept-language: zh-cn#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285007#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> content-length: 38#

#2.0#2016-02-04 03:37:36 AM#DEBUG####Client Request Trace#1454576856285002#94d99a4e-f76b-493c-94cb-2f79ab104889##com.sap.mobile.platform.server.online.filter.application.AbstractClientFilter:doFilter########661#####>> referer: http://123.249.24.233/POST_ip_port.phpAccept: */*#

[Abdul_Azeez1]

Hi Ashwin,

Sorry for the delayed response as I was traveling last week. Have you selected "Device" and "Network Connection" plugins under Cordova plugins tab in Device Configuration?

Regards,

Azeez

[AshwinKatkar]

[michal_keidar]

The browser's console.. Open the browser's Developer Tools (F12) and show what error appears in the console

[AshwinKatkar]

Hi Michal,

Thank you for quick reply and your support.

Here is the snapshot of error page.

[michal_keidar]

You can see that it can't find Devapp.js file. Is this a file you added or is it part of the generated application?

Which template did you use?

Does it run for you directly from Web IDE?

[AshwinKatkar]

Hi Michal,

Here are the details:

1.  Its generated Application

2.  Kapsel offline template ui5

3.  Yes it is working when running directly

[michal_keidar]

Adding Kapsel colleagues, , can you please have a look?

Thanks,
Michal.

[Abdul_Azeez1]

Hi,

Append /webapp/index.html to the deployed URL when you open to run

For example

https://<your appname>-<your account>.dispatcher.hanatrial.ondemand.com/webapp/index.html

Thanks,

Azeez

[Former Member]

Hi Rasheed,

I am getting the same issue but am unable to deploy the project. Getting the blue screen when follow the steps provided by Michal but when I append /webapp/index.html to the deployed URL, I again get the error message HTTP Status 404- Not Found.

Please Advise.

[michal_keidar]

If the application was built upon deployment then the reference to the index.html may have changed. You have a reference to the welcomeFile (index.html) in your app's neo-app.json, what does it say there? If the application was built and a build target folder(probably "dist") was created then you should change the welcomeFile path to match the index.html in the dist folder