Zum Hauptinhalt springen

Editor für Custom Scripts im TheFlex

In den Einstellungen des TheFlex lassen sich Custom Scripts für beliebige Webseiten und Webapps konfigurieren. Mit diesen können Funktionen hinzugefügt oder visuellen Anpassungen vorgenommen werden, ohne die Webseite ändern zu müssen.

Code Editor für Custom Scripts

Hello world

Normales Javascript kann verwendet werden um Webseiten anzupassen.

CSS anpassen

Durch das Anpassen des CSS kann das Ausehen der Seite verändert werden.

Page Ready Event

Erst nach diesem Event ist die Seite vollständig geladen und gerendert.

Dialog mit Autofokus öffnen

Dieses Skript öffnet einen anpassbaren Dialog mit Autofokus in welchen direkt gescannt werden kann.

Loading...
0 von 3000 Zeichen verwendet (minified)

Wichtige Hinweise für Skripte

Empfehlung

Falls es möglich ist diese Skripte direkt in der Webseite zu pflegen und mit auszuliefern, dann sollte immer dieser Möglichkeit bevorzugt werden. Falls dies jedoch nicht möglich ist, kann diese Funktionalität der Custom Scripts verwendet werden. Beispiele, wann diese Custom Scripts sinnvoll verwendet werden können, sind beispielsweise:

  • Visuelle Anpassungen an alten Webseiten (zB. ITS-Mobile), die nicht mehr oder nur schwer änderbar sind.
  • Visuelle Anpassungen an Webseiten für einige spezielle Geräte.
  • Hinzufügen von Login-Funktionalitäten (zB. Login per NFC-Chip oder QR-Code) bei Anmeldeseiten, die nicht veränderbar sind (zB. Microsoft Azure oder SAP).
  • Hinzufügen von beliebigen Skripten zu Webseiten oder Webapps anderer Dienstleister ohne Zugriff auf deren Sourcecode.

deviceready-Event

Wenn im Skript auf bestimmte Elemente, zB. ein Input-Feld oder Button zugegriffen werden soll, dann muss das deviceready Event abgewartet werden. Erst dann ist die Seite vollständig geladen und alle Elemente vorhanden:

document.addEventListener("deviceready", function () {
// my script
});

Aktive URL

Für jedes Skript kann eine URL definiert werden, bei welcher das Skript aktiv ist. Dies bedeutet, dass das Skript nur bei diesen URLs injected wird. Dabei wird jedoch nicht exakt auf diese URL geprüft, sondern lediglich, ob die aktuelle URL mit der konfigurierten URL startet.

Beispiel: Es wird die URL https://theflexbrowser.com geöffnet.

  • Falls als URL für das Skript https gepflegt ist, dann wird dieses Skript ausgeführt.
  • Falls als URL für das Skript https://theflexbrowser gepflegt ist, dann wird dieses Skript ausgeführt.
  • Falls als URL für das Skript https://other.com gepflegt ist, dann wird dieses Skript nicht ausgeführt.
Achtung

Es muss sorgfältig überprüft werden, welche Skripte ausgeführt werden, da diese vollen Zugriff auf allen Daten innerhalb der aufgerufenen Webseite sowie auch alle Nutzereingaben haben.

Skripte in den Browser übertragen

Um das Skript aus diesem Editor in den Browser zu übertragen, gibt es drei Möglichkeiten:

1. Pflege über ein MDM

Der einfachste Weg ist der Rollout der Skripte über ein MDM wie SOTI oder Intune. In diesen lassen sich auch die Skripte pflegen, wodurch sie automatisch auf die Geräte übertragen werden.

Achtung

Intune unterstützt keine neuen Zeilen innerhalb der JSON-Dateien, daher muss das Custom Script verkürzt werden. Auch Anführungszeichen in Custom Scripts müssen mit einem Backslash ( \ ) versehen oder in einfache Anführungszeichen geändert werden ( '' ).

2. Import über QR-Code

Falls das Skript kürzer als 3000 Zeichen hat, dann kann es hier über den Button Als QR-Code exportieren als ein QR-Code angezeigt werden. In den Einstellungen des TheFlex Browsers kann bei den Skripten über Skript importieren dieser QR-Code gescannt werden.

3. Screenshare

Diese Möglichkeit ist lediglich für die Entwicklung zu empfehlen. Falls das Gerät an diesen PC angeschlossen ist, dann können die Skripte per strg-c und strg-v in die Einstellungen des Browsers kopiert werden.

Hinweis

Für das Release in Q3 ist eine weitere Möglichkeit geplant, um die Skripte noch einfacher von diesem PC auf beliebige TheFlex Browser zu übertragen. Sobald diese neue Funktion genutzt werden kann, wird dies in diesem Artikel sowie in den Changelogs bekannt gegeben werden.