Ok, so I know that HTML in itself isn't done yet, and I've done my fair share of reading for HTML5's offline modes.
Here's the question:
Can I set up an offline app in such a way that the entire system works offline, and SHARES a cache (or an XML repository, or a SQL-Lite DB or something) with other clients in the SAME network?
For example, my system runs on clients that need to share information with each other within a local network, but its fully web based. In case the local network's router dies, how can these clients continue to communicate with one another?
=== END ===
NOTE: If you're still not clear, I'd recommend you read on. The information below is to further clarify what I want.
In case you're still reading, here's a detailed example:
4 people in a restaurant are using a web based ordering system. They each have an iPod Touch (lol) which is connected to the internet via Wifi. Each member logs in to the system under a shared account, which allows them to share information. The cook is also connected, but uses a mounted iPad (lolz) in the kitchen.
When a waiter records an order, the data is stored in a DB, and AJAX is used to constantly refresh the Cook's screen, so he is notified instantly.
Assume, Zeus struck down the electricity in the restaurant.
Now, there's no internet connection, but all devices in question still function thanks to their inherent battery-oriented nature.
The web app switches to offline mode, and utilizes cached menus and screens.
BUT!
How does the offline system share information between client devices? How does the iPod Touch #3 tell the Cook's iPad - "Hey there, this is order #5352"?
The most obvious thought is a shared cache or something...
Ideas?
That is not possible. WebPages cannot communicate without a server.
The only thing you could do is setting up a local server for the case that the server on the internet is offline or not reachable.
Related
Wow, my problem seems like it must be so common that I must just be missing something really obvious but here goes:
Is there any way to trigger/schedule a dormant offline HTML5 app to run either:
when network comes available,
or regularly.
I want to create an offline HTML5 app that will record details of a delivery (item description, recipient's name, photo, timestamp, etc). The data will be written to local storage (the photo converted to base64). If the app has network then the delivery data will be uploaded to a remote server. If the app does not have network then, even if the user powers the device down, next time the device is up and has network, I need the app to do the upload without any action by the user.
I've searched and found nothing. I'm guessing that offline apps only get run-time when in the foreground? If someone could confirm that then that would at least be good to know, even if it's not what I'd like to hear.
Thanks
Background sync, exactly what I was after (although in 2016 it was Chrome-only):
https://developers.google.com/web/updates/2015/12/background-sync
I created a scheduling software for beauty salons as a web application. The idea is that the business owner can schedule customer appointments with a hair stylist. I made it web based because eventually these beauty salons need to integrated into a larger cloud service. So far, I've only put in about 40 hours of coding.
One challenge i am encountering is that a lot of beauty salons may have poor internet connectivity. They may experience temporary outage that last several hours to several days. But during this time, they still want access to this web application .. at the very least for read only purposes.
I understand that html 5 in modern browsers support offline capabilities via things like localStorage and cache manifest. It appears to me that at the moment, I need to do a drastic rewrite of my existing application to make use of localStorage and cache manifest to allow the web application to work offline. The reason this is so is because my web application writes/saves a lot of information to urls like http://mywebsite.com/api/somefunction?queryparams=value1 via ajax calls. These ajax calls need to be replaced by function calls that write to localstorage.
So my questions are:
a) To enable my web application to work offline (at the very least, read only of the website should be offline), I should replace my ajax calls with calls to localStorage. Is this the best approach?
b) Would it have been better to create this application as a .NET desktop application? Especially if there are microsoft technologies that help with synchronizing stored client data with an external database at a later time?
My opinion:
a) I wouldn't say you should replace your Ajax calls. Rather, you want your code to notice when it is offline and store stuff in localStorage then. You wouldn't always store in localStorage as your clients are going to be online sometimes.
b) That's kind of a loaded question I think. :) So... my thinking is this: Building a web site makes sense as it would let your clients at the salon access their data both from computers in the store and other devices as well. So for example - if the salon's internet access is down, the employees could perhaps use your website via their mobile phones too. Having the data be web bound gives them more ways to get to it.
So I have been thinking about building quite a complex application. The idea of building an html5 version has become quite an attractive possibility. I have a few questions about it first however.
My first concern is how reliable the offline application API's are at the moment. I have been looking into this standard: http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html and it looks pretty easy to implement and use, but I am wondering how easy it is to use? And assuming you set up the manifest etc, is the web application just accessed (offline) by going to the same url you originally downloaded the application from?
My other concern is the use of sockets. This offline application still needs to be able to communicate with local servers, I ideally wanted to avoid having to host a web-server, a socket connection however would be plausible. How well do websockets currently work when the browser is offline? Is it possible, to have a fully networked / interactive browser application running even without an active internet connection? (after the app is first downloaded)
Any insight would be great!
That's a lot of questions, you may want to consider breaking it up into more easily answerable portions more directly related to what, exactly, you're trying to achieve. In the meantime I'll try to provide a short answer to each of your questions:
My first concern is how reliable the offline application API's are at
the moment.
Fairly reliable, they have been implemented for a number of versions across most major web browsers (except IE).
is the web application just accessed (offline) by going to the same
url you originally downloaded the application from?
Yes. Once the offline app has been cached, the application is served from that cache. No network requests will be made unless you explicitly request URLs from the NETWORK or FALLBACK sections of the manifest or aren't covered by the manifest at all, apart from to check whether the manifest itself has changed.
This offline application still needs to be able to communicate with
local servers, I ideally wanted to avoid having to host a web-server,
a socket connection however would be plausible.
A Web Socket still requires a web server. The initial handshake for a Web Socket is over HTTP. A Web Socket is not the same thing as a socket in TCP/IP.
How well do websockets currently work when the browser is offline?
They won't work at all, when you've set a browser to offline mode it won't make any network requests at all. Note that a browser being set to offline is not the same thing as the offline in 'offline API'. The offline API is primarily concerned with whether or not the server hosting the application can be reached, not whether the the browser is currently connected to a network or whether that network is connected to the internet. If the server goes down then the app is just as 'offline' as if the network cable on the user's computer got unplugged. Have a read through this blog post, in particular the comments. My usual approach to detecting offline status is to set up a pair of files in the FALLBACK section such that you get one when online and the other when offline - request that file with AJAX and see what you get.
Is it possible, to have a fully networked / interactive browser
application running even without an active internet connection?
Yes, but I don't think that means what you think it does. Separate instances of the app running on different browsers on different machines would not be able to communicate with each other without going via the web server. However, there's no requirement that the web server be 'on the internet', it will do just fine sitting on the local network.
What is new in HTML 5’s “offline web applications” feature which was not already available in all browsers?
Offline caching is the job of the browser — how did it become a job of HTML?
A web cache is a mechanism for the
temporary storage (caching) of web
documents, such as HTML pages and
images, to reduce bandwidth usage,
server load, and perceived lag. A web
cache stores copies of documents
passing through it; subsequent
requests may be satisfied from the
cache if certain conditions are met.
As written in Wikipedia’s article for Web cache.
And this is written for offline web cache in the W3C website:
In order to enable users to continue
interacting with Web applications and
documents even when their network
connection is unavailable — for
instance, because they are traveling
outside of their ISP's coverage area —
authors can provide a manifest which
lists the files that are needed for
the Web application to work offline
and which causes the user's browser to
keep a copy of the files for use
offline.
What is HTML 5 doing better and different in caching?
Is it similar to offline mode in Internet Explorer 5? And can we cache the data beyond the limit of amount of space set in browser?
Please give me an example so that I can understand the difference of HTML 5 offline cache, and browser caches.
Web browser caching is when browsers decide to store files locally to improve performance. HTTP allows web servers to suggest browsers how long to store the files for, and allows browsers to ask the server whether a file has changed (so that they can avoid re-downloading it).
However, it’s not designed to reliably store assets required by an offline application. It’s ultimately up to the browser whether, and for how long, it caches the files. And browsers will often stop using their cached version if they can’t contact the server to check that it’s up-to-date.
The HTML5 offline web applications spec provides web authors with the ability to tell browsers what to store for offline access, and requires browsers to keep those files up-to-date when it is online. It also provides a DOM property that tells the developer whether the browser is online or offline, and events that fire when the online status changes.
As Peeter describes in his answer, this allows web app developers to store user-inputted data whilst the user is offline, then sync it with the server when they’re online again. The developer has to do this storage and syncing manually, as the browser only provides the events indicating online status, but if the browser also supports localStorage, the developer can store the data there.
I can do no better than point you to the relevant chapter of Dive into HTML5: http://diveintohtml5.ep.io/offline.html
You can now cache dynamic data, instead of just js/css/html files / images.
Lets say you've got a todo list application open in your browser. You're connected to the internet and you're adding a bunch of stuff you have to do.
Boom, you're on an airplane without a connection. You've got 6 hours of time to kill so you decide to get some work done. You finish all of the things on your todo list (the list was still open in your browser). You select all of the items and change their state to "finished".
Your plane lands, you open up your laptop and refresh the page. All the changes you did without a connection are now synced to the server as you have a internet connection now.
With many browsers adding proper local storage support (and with this whole HTML5 buzz), there is a lot of talk about offline web apps competing with desktop software. But, as a matter of fact - one quick "clear private data" on your browser (which a lot of people do) - clears all the local storage data.
I'm now thinking that local storage in browsers can at best be used to cache data temporarily before being sync-ed with the web server, but truly offline web applications can't rely on HTML5's local storage permanently due to the problem I outlined above.
Is there a scope for offline web applications that actually depend on data extensively?
My take on this is that the offline capability of online web apps can compete with desktop software, but not pure offline web-apps.
Why? Well, the major drawback of online web apps was what happens when you lose your network connection when doing any work. Seeing as this can be resolved now, the competition is truly on. Imagine editing a document online, then move around without internet, come back online and then sync the changes and continue to work as if nothing happened. That is truly awesome.
For this to work, the browser should allow to store data in a location that you can pick which would mean access to OS layer, which will probably not happen anytime soon...