1 of 1 people found this helpful
Hi Mariano, it sounds to me your customer is trying to cache their web-app being served by a web-server. If this is the case HTML5 specification includes a section call Offline Web Applications through something called “manifest file”. It permits control through describing what needs to be cached and what does not.Although the content of manifest could be embedded in HTML, in keeping with good-practice, the manifest file should be a separate file and
composed of three main sections:
Below is an example of .manifest file:CACHE MANIFEST#Version 1.0.0CACHE:
- The CACHE section describing resources to be cached
- The NETWORK section describing resources that can only be accessed online
- The FALLBACK section contains only one line specifying what is the resource to be displayed when the user is offline and tries to access a resource that has not been cached.
FALLBACK:/fallback.htmlTo note: The syntax of this file is very strict therefore if there are any syntax errors it will fail. Content of this file is also case sensitive. Any resource listed in the cache that fails to download will result in throwing an error event and aborting the process of caching.Also note that the manifest file has to be served by the server with the following MIME type: text/cache-manifest
And finally, in order to tell the browser where the manifest file is the following code is required in the index.html or start page. Where "offline" is the name of your file.
<html lang=”en” manifest=”offline.manifest”>
</html>There are a couple of considerations to take into account when deploying your application through the manifest file:
The above is an excerpt from an internal and unreleased whitepaper.Hope this helps.
- Make sure you’re aware of how the manifest file is cached on the browser. You can control how to cache the manifest file on the server.
- When updating your web application be sure to also update the manifest file. The only way for an application to download again the resources listed in the cache is if the maniffest has been modified
Thank you, Peter, it is very clear.
The customer tried this solution. He tested with manifest and his app runs in offline mode on Firefox, Crome, Safari, Opera Browsers on iPad, iPhone, Andriod, Windows XP,7,8(IE10) and also in the Zetakey-Browser on the ES400 or MC70.
He can start and use the app on all this browsers and OS in offline mode.
Now, the app runs with Rhoelements on ES400 and the app starts while the device is online. All files and data are stored in the offline cache.
However if the device has no connection to the web server or the web server is stopped, the app do not start using Rhoelements.
Is there anything to configure in RhoElements config file that we are missing?
Mariano, the RhoMobile documentation has a blurb on network connection setup. Below is an excerpt
For more details feel free to naviaget to:
Thanks, Peter, I didn't have time to go through this doc. I will let you know if I figure out if I find the solution there.
Alright, Peter, what you send me is for Native applications, but what we need is for hybrid application. Basically what we need is to launch RhoElements to connect to a web server and keep in cache pure HTML5 pages and some CSS files.
I was reading the documentation here are the statements:
However, in other part of the web says this:
*Ability to leverage Offline Cache capabilities with HTML5 manifest files for Hybrid applications that operate in an occasionally disconnected model
Is this last paragraph talking about the internal/local web Server?
Is there any other way to keep in cache these pages without the internal web sever? Why can we use the cache file?
Thank you so much
Mariano, everything covered in this thread is applicable to Hybrid Web applications. The interesting aspect of web application development and deployment is that there are numerous ways of achieving the same thing. However, simply put you don’t need an internal WebServer to run your application in the hybrid model. Hybrid suggests that when intermittent network disruption occurs the web app continues to operate. In order to achieve this the Web app uses 2 features of the HTML5 standard; Offline Web Application and Client-side database storage. Both features are supported by RHoElements.
The end-user running a device with RhoElements runtime installed can simply point to the cloud (web server) and when connectivity is loss the app continues to work offline with a locally deployed application (achieved with Offline Web application feature aka as App Cache) on a local database, and then synch data with the cloud when returning back online (client-side database storage). The share data with the rest of the cloud can be done effectively with RhoConnect. However, if RhoConnect is not desired then something needs to step in and perform data synchronization.
Attached is a very simply web application leveraging both of the HTML5 features highlighted above. Simply serve the app on a WebServer and have a device running RhoElements point to it. Enter some data and then walk away from within connectivity range or turn off the WebServer. You will see that the Web app is still operational and subsequent data entry is captured/stored locally.
Hope this proves to be helpful.
OfflineWebAppSrc.zip 2.4 K
Fantastic! Thanks so much Peter! Your answer is very helpful for understanding the logic.
I did at test with the example you provided me. However, I would like to clarify the offline execution process.
You mentioned this would allow the user to browse the app even though there are intermittent network connect but. let's suppose I run the app with connection, some files are stored in cache, then I close the app and lost connection, should I be able to start the app again? This is where our customer has the issue, he gets "page not found", instead of showing the files in cache. In my case I just have a withe screen. I added the index.html in the manifest too. Or should I at least start the app with connection?
MyHomeStuff.manifest file content:
Thanks again for the all support so far
Hi Mariano, I've ran several tests on this situation and found that regardless of the browser or render engine used the Offline Web App (App Caching) feature is session bound. That means once you exit the app its gone, except for the database. Connectivity is required to launch the app, simply because it is served from a webserver. Note that RhoElements via Config.xml points to a WebServer upon startup so encountering "page not found" is normal if there is no connectivity. It is recommendated that RhoElements is deployed and configured to run in full screen so that end-users cannot exit from the app.
The hybrid model isn't quite full native. I'm uncertain as to the reason for serving the app from the server but if the main goal here is to run offline the client could essentially consider staging devices with the all necessary files such as index.html, main.js, style.css, etc... Then have RhoElements via config.xml point the the startup page (index.html) residing on the device. This will permit sucessfully launching of the app regarless of the connectivity state.
Thank you so much, now everything is clear.