Vývoj webové aplikace, která běží v Kiosk režimu má svá specifika. Níže je popis nezbytných požadavků pro to, aby mohl aplikace úspěšně fungovat:
- Aplikace běží v rámci Kiosku v sandboxovaném iFrame s dovolenými formuláři a javascripty
- Aplikace, resp. iFrame běží z lokálního úložiště, nemá HTTP Origin
- Origin je v aplikaci vidět jako `null`, jakákoliv omezení na hlavičce Access-Control-Allow-Origin nemohou být využita
- Aplikace má všechna omezení vyplývající z použití iframe sandboxu s povolenými `allow-scripts` a `allow-forms`
- Aplikace nemá přístup do sessionStorage
Důvody pro tato omezení jsou následující:
- pokud nebude obsah "sandboxovaný", nemůže HUGPORT Kiosk zaručit, že nebude narušeno fungování tabletu
- obsah, který umožní kompletní manipulaci s prohlížečem je problematický a může vyvolat nestabilitu zařízení
- pro to, aby bylo možné dodržovat nastavená SLA, není možné dovolit obsahu 3. strany, aby jakkoliv zasahoval do běhu webview/aplikace
Weby, které budou bezproblémově fungovat musí běžet jako html na HTTPS , bez odkazů mimo doménu, kde je web spuštěn a bez používání technologií jako sessionStorage, localStorage a pod, které jsou svázané přímo s prohlížečem.
Testování
Pro testování je nejlepší vytvořit stránku, kterou spustíte mimo webserver jen jako soubor v prohlížeči, např. index.html
Uvnitř takto spuštěné html stránky vytvořte iframe
<iframe src="https://example.com/" sandbox="allow-forms allow-scripts"> </iframe>
Pokud bude vaše aplikce/webová stránka fungovat v tomto režimu, bude fungovat i na tabletech.
Example soubor pro emulaci sandboxu je přiložen níže.
Rozlišení
| Zařízení | Rozlišení (velikost obsahu) v kiosku |
| Lenovo Tab3 10 Business | 1920 x 1100px |
Snippet
Nezbytný kód pro fungování Kiosku a odchytávání aktivity uživatele tak, aby bylo možné přepínat mezí smyčkou obsahu a dotykovým režimem. Tento kód umístěte na samý konec vaší Aplikace před koncový tak body.
<script type="text/javascript">
function clickKioskNotifier(e) {
window.parent.postMessage({'type':'hugportClickNotifier'}, "*");
return false;
}
window.document.addEventListener("click", clickKioskNotifier);
</script>
Komentáře
0 komentářů
Prosím přihlaste se, abyste mohli napsat komentář.