Asked 12/2, 2013 at 20:31 Answered 13/2, 2013 at 6:55

Solved google-chrome google-chrome-extension kiosk kiosk-mode

I'm deploying a kiosk system that uses Chrome to display a java web app running in jetty started with a windows service wrapper. It takes some time after the system starts for jetty to be ready to serve content so for now I have a wait occurring which then launches Chrome in kiosk mode. This is pretty ugly, unreliable and slow.

What I'm trying to do in order to make it run smoother is to use a Chrome extension that detects the 4xx error and sets a timeout that reloads the page. I have this working as is but it's still an ugly solution since the page is refreshing every 3 seconds and it's the "Oops! Google Chrome could not find..." page that's showing to the user while they're waiting. I can fix the first problem with an ajax request in the background to detect when the page is ready but I really want to show the user a nice "Loading" screen instead of the error page. I'm not a Chrome extension developer and all of my attempts to fix this with an extension have failed so far.

I thought it would be possible to customize the error page but I can't find any information on how to do that since all of the search results I find on the topic center around the 512 minimum size issue.

Ayr answered 12/2, 2013 at 20:31 Comment(0)

You can customize the error page with webNavigation API. Add an event Listener for onErrorOccurred event and update relevant details.

Check sample code as a reference.

Demonstration

manifest.json

Registered background page and added all relevant permissions to manifest file.

{
    "name": "Customize error page",
    "description": "",
    "version": "1",
    "manifest_version": 2,
    "background": {
        "scripts": [
            "background.js"
        ]
    },
    "permissions": [
        "webNavigation",
        "<all_urls>"
    ],
    "web_accessible_resources": [
        "page.html"
    ]
}

background.js

Redirected to our custom Page in case of any error, you can customize this to desired level.

//Adding a Listener to Error Occured Event
chrome.webNavigation.onErrorOccurred.addListener(function (details) {
    // Updating the browser window with desired URL
    chrome.tabs.update(details.tabId, {
        url: chrome.extension.getURL("page.html")
    });
});

page.html

Some trivial code

<html>
    <style>
        body {
            background:yellow;
            position:absolute;
        }
    </style>

    <body>
        <div style="top: 200px;position: absolute;left: 500px;width: 500;font-size: 40px;">This is a Nice Description</div>
    </body>

</html>

Reference

webNavigation.onErrorOccurred

Bartels answered 13/2, 2013 at 6:55 Comment(0)

Go to options, privacy settings, and uncheck the box:

"Use a web service to help resolve navigation errors"

Detailed instructions here.

Ventriculus answered 12/2, 2013 at 21:0 Comment(1)

The issue is that the server is not up and so the problem is probably a 408 error and not a 404 error. There is no custom server-side error page to display. – Ayr 12/2, 2013 at 21:24

Demonstration

manifest.json

background.js

page.html

Reference

Recommended topics

Hot tags