Chrome Kiosk-Apps erstellen und bereitstellen

Dieser Artikel richtet sich an Chrome-Administratoren und -Entwickler, die Erfahrung in der Entwicklung von Chrome-Apps haben.

Als Chrome-Administrator können Sie Geräte, auf denen Chrome OS ausgeführt wird, in zweckgebundene Geräte verwandeln, z. B. um sie als digitale Beschilderung oder interaktives Display zu nutzen. Sie können entweder standardmäßige Kiosk-Apps über den Chrome Web Store bereitstellen oder eigene Kiosk-Apps erstellen.

Einige Chrome-Geräte ab OS-Version 57 unterstützen auch Android-Apps. Weitere Informationen dazu, wie Sie Android-Apps auf verwalteten Chrome-Geräten installieren, finden Sie im Artikel Android-Apps auf Chrome-Geräten verwenden, die als Kiosk ausgeführt werden.

Hinweise

  • Bevor Sie Kiosk-Apps auf Geräten mit Chrome OS bereitstellen können, müssen Sie die Chrome-Geräte registrieren.
  • Sie können gepackte Chrome-Apps verwenden, um Kiosk-Apps zu erstellen. Gehostete Apps können jedoch nicht genutzt werden.
  • Verwenden Sie Chrome-Apps, die für die Ausführung im Vollbildmodus eingerichtet sind.
  • Halten Sie sich an die Best Practices für die Entwicklung von Chrome-Apps.

Schritt 1: Chrome Kiosk-App erstellen

Als Entwickler haben Sie zwei Möglichkeiten, eine Kiosk-App für die Bereitstellung auf Chrome-Geräten zu erstellen. Sie können entweder eine vorhandene Web-App nutzen oder eine neue erstellen.

Ich habe eine Web-App

Wenn Sie bereits eine Web-App haben, können Sie sie mithilfe des Chrome App Builders als Kiosk-App verpacken.
  1. Erstellen Sie auf dem Computer einen Ordner für die App-Dateien.
  2. Öffnen Sie die Erweiterung "Chrome App Builder".
    Wenn Sie die Erweiterung noch nicht haben, müssen Sie dem Chrome-Browser jetzt den Chrome App Builder hinzufügen.
  3. Geben Sie den Namen und die erste Version Ihrer Kiosk-App ein.
    Verwenden Sie für die erste Version eine niedrige Nummer, z. B. 0.0.0.1. So können Sie die Versionsnummer erhöhen, wenn Sie später neue Versionen der App hochladen.
  4. Geben Sie die URL der aktuellen Startseite der App ein.
    Sie wird die Landingpage der neuen Kiosk-App.
  5. Optional: Wählen Sie Steuerelemente für die Navigation aus, z. B. "Zurück", "Weiter", "Neu laden" oder "Sitzung neu starten".
  6. Optional: Geben Sie Werte für die Zeitüberschreitung an:
    • Zeitüberschreitung bei Inaktivität: Zeitraum der App-Inaktivität, bevor Browserdaten wie App-Cache und Cookies gelöscht werden.
    • Zeitüberschreitung vor Rückkehr zur Startseite: Zeitraum der App-Inaktivität, bevor die Startseite wieder aufgerufen wird. Browserdaten werden nicht gelöscht.
      Der Standardwert beträgt in beiden Fällen 0 Minuten, das heißt, für die App gilt kein Zeitlimit.
  7. Optional: Geben Sie die Nutzungsbedingungen für Ihre App-Nutzer ein.
  8. Optional: Drehen Sie die Startseite so, dass sie auf das Gerät passt, auf dem sie ausgeführt werden soll.
    Beispiel: Wenn eine App auf einem Gerät mit Hochformat ausgeführt werden soll, können Sie sie um 90 Grad drehen.
  9. Wählen Sie Kioskmodus aktiviert aus.
  10. Klicken Sie auf Kiosk-App exportieren.
  11. Wählen Sie einen Speicherort für die exportierten App-Dateien aus und klicken Sie auf Auswählen.

Nachdem Sie eine Kiosk-App mit dem Chrome App Builder erstellt haben, können Sie sie anpassen, indem Sie weitere Dateien hinzufügen.

Ich möchte eine neue App erstellen

Mithilfe der in den folgenden Schritten bereitgestellten Beispieldateien können Sie eine einfache Kiosk-App erstellen.
  1. Erstellen Sie auf dem Computer einen Ordner für die App-Dateien. 
  2. Erstellen Sie die HTML-Datei der App.
    1. Erstellen Sie mit einem Texteditor eine HTML-Datei.
      Hier ist eine Beispiel-HTML-Datei.
    2. Speichern Sie die Datei im App-Ordner als application.html.
  3. Erstellen Sie die Manifestdatei.
    1. Erstellen Sie mithilfe eines Texteditors eine JSON-Datei (JavaScript® Object Notation). Hier ist eine Beispiel-JSON-Datei.
    2. Achten Sie darauf, dass für kiosk_enabled der Wert "kiosk_enabled":true festgelegt ist.
    3. Optional: Damit die App nicht als reguläre App ausgeführt wird, setzen Sie den Wert für kiosk_only auf "kiosk_only":true.
    4. Optional: Wenn Sie die Zeit verkürzen möchten, die Webseiten zum ersten Laden benötigen, geben Sie im Webview-Steuerelement der Kiosk-App für das Webview-Tag partition="persist:" an.
      Weitere Informationen finden Sie in den Entwicklerinformationen zum Partitionsattribut (nur auf Englisch verfügbar).
    5. Überprüfen Sie mit einem geeigneten Validierungstool eines Drittanbieters, z. B. JSONLint, ob der JSON-Code richtig formatiert ist.
    6. Speichern Sie die Datei im App-Ordner als manifest.json.
  4. Legen Sie die Höhe und Breite für die App fest.
    1. Erstellen Sie mithilfe eines Texteditors eine CSS-Datei (Cascading Style Sheet). Hier ist eine Beispiel-CSS-Datei.
    2. Speichern Sie die Datei im App-Ordner als application.css.
      Hinweis: Kiosk-Apps werden automatisch im Vollbildmodus verwendet.
  5. Optional: Lassen Sie Nutzer die Kiosk-Sitzung beenden.
    1. Erstellen Sie mithilfe eines Texteditors eine JS-Datei (JavaScript). Hier ist eine Beispiel-JS-Datei.
    2. Speichern Sie die Datei im App-Ordner als application.js.
  6. Erstellen Sie das Hintergrundskript.
    1. Erstellen Sie mithilfe eines Texteditors eine JS-Datei. Hier ist eine Beispiel-JS-Datei.
    2. Speichern Sie die Datei im App-Ordner als background.js.
  7. Erstellen Sie die Symbole für die App und speichern Sie sie im App-Ordner.
    1. Erstellen Sie ein Symbol im Format 128 x 128 Pixel und speichern Sie es als 128.png.
    2. Erstellen Sie ein Symbol im Format 96 x 96 Pixel und speichern Sie es als 96.png.

Alternativ können Sie diese Beispiel-ZIP-Datei verwenden,. Sie enthält Dateien für eine Test-App mit Steuerelementen für die Navigation und einer Schaltfläche "Zurücksetzen". Eine Live-Version der App, Chrome Browser Kiosk App 1.0, ist im Chrome Web Store veröffentlicht. Sie können die Dateien mit einem beliebigen Texteditor bearbeiten.

Schritt 2: Kiosk-App testen

Als Entwickler können Sie testen, ob Ihre Kiosk-App auf Chrome OS-Geräten funktioniert.

  1. Melden Sie sich auf einem Chrome-Gerät in Ihrem Google-Konto an.
  2. Speichern Sie den App-Ordner auf dem Testgerät.
  3. Rufen Sie chrome://extensions auf.
  4. Aktivieren Sie rechts oben den Entwicklermodus.
  5. Klicken Sie auf Entpackte Erweiterung laden.
  6. Suchen Sie den App-Ordner und wählen Sie ihn aus.
  7. Öffnen Sie einen neuen Tab in Chrome und dann klicken Sie auf Apps und dann klicken Sie auf die App. Überprüfen Sie, ob sie geladen wird und funktioniert.
  8. Nehmen Sie bei Bedarf Änderungen in der Datei "manifest.json" vor, hosten Sie den App-Ordner und testen Sie die App noch einmal. Wiederholen Sie den Vorgang gegebenenfalls, bis die App wie gewünscht funktioniert.

Schritt 3: Im Chrome Web Store veröffentlichen

Als Entwickler können Sie Apps und Erweiterungen entweder für alle Nutzer verfügbar machen oder einzeln festlegen, wer sie installieren darf. Es gibt zwei Möglichkeiten, Kiosk-Apps im Chrome Web Store zu veröffentlichen:

  • Öffentlich: Jeder kann die App sehen und installieren.
  • Nicht gelistet: Nur Nutzer mit dem Link zur App können sie sehen und installieren. Sie erscheint nicht in den Suchergebnissen im Chrome Web Store. Der Link zur App kann auch für Nutzer außerhalb Ihrer Domain freigegeben werden.

Wenn Sie eine Kiosk-App zum Chrome Web Store hinzufügen möchten, komprimieren Sie den Ordner, in dem Ihre Dateien enthalten sind, in eine ZIP-Datei. Anschließend können Sie die Datei im Chrome Web Store veröffentlichen

Schritt 4: Kiosk-App bereitstellen

Als Administrator können Sie die Kiosk-App zur Google Admin-Konsole hinzufügen. Wenn Sie mehrere Apps hinzufügen möchten, können Sie dies mithilfe der Standardrichtlinien auf einmal tun. Alternativ können Sie jede App einzeln hinzufügen und dabei die jeweiligen Richtlinien festlegen.

Mehrere Apps hinzufügen

  1. Melden Sie sich in Ihrem Google Admin-Konsole an.

    Melden Sie sich mit Ihrem Administratorkonto an. Dieses Konto endet nicht auf @gmail.com.

  2. Klicken Sie in der Startseite der Admin-Konsole auf Geräte und dann Chrome-Verwaltung.

    Möglicherweise müssen Sie unten auf Mehr Widgets klicken, damit Geräte angezeigt werden.

  3. Klicken Sie auf Geräteeinstellungen.
  4. Wählen Sie links die Organisation aus, in der Sie Richtlinien konfigurieren möchten.
    Wenn die Richtlinien für alle Nutzer in der Organisation gelten sollen, wählen Sie die Organisation auf oberster Ebene aus. Wählen Sie andernfalls eine untergeordnete Ebene aus.
  5. Scrollen Sie zu Kioskeinstellungen.
  6. Klicken Sie für Kiosk-Apps auf Kioskanwendungen verwalten.
  7. Zum Hinzufügen der App klicken Sie auf Chrome Web Store und suchen Sie nach Ihrer Kiosk-App:
    • Öffentliche Apps suchen Sie über den Namen oder die ID.
    • Nicht gelistete Apps suchen Sie über die ID.
  8. Wenn Sie eine App manuell hinzufügen möchten, klicken Sie auf Benutzerdefinierte App angeben:
    • Geben Sie für Trusted Tester-Apps im Chrome Web Store die App-ID und die URL https://clients2.google.com/service/update2/crx ein.
    • Wenn die App nicht im Chrome Web Store gehostet ist, geben Sie die App-ID sowie die URL des Webservers des Drittanbieters ein.
  9. Klicken Sie auf Hinzufügen und dann Speichern.
  10. Klicken Sie zum Bestätigen auf Speichern.

Einzelne Apps hinzufügen

  1. Melden Sie sich in Ihrem Google Admin-Konsole an.

    Melden Sie sich mit Ihrem Administratorkonto an. Dieses Konto endet nicht auf @gmail.com.

  2. Klicken Sie in der Startseite der Admin-Konsole auf Geräte und dann Chrome-Verwaltung.

    Möglicherweise müssen Sie unten auf Mehr Widgets klicken, damit Geräte angezeigt werden.

  3. Klicken Sie auf App-Verwaltung.
  4. Wählen Sie links aus dem Filtermenü App-Typ die Option Chrome-Apps aus.
  5. Klicken Sie auf die App, die Sie konfigurieren möchten.
  6. Klicken Sie auf Kioskeinstellungen.
  7. Wählen Sie links die Organisation aus, deren Nutzer die Kiosk-App ausführen sollen.
    Wenn die Richtlinien für alle Nutzer in der Organisation gelten sollen, wählen Sie die Organisation auf oberster Ebene aus. Wählen Sie andernfalls eine untergeordnete Ebene aus.
  8. Legen Sie die App- und Erweiterungsrichtlinien fest. Weitere Informationen
  9. Klicken Sie auf Speichern.

Weitere Informationen

War das hilfreich?
Wie können wir die Seite verbessern?