• Zum Inhalt springen

Support Center
Wissensdatenbank, Hilfe und FAQ

  • Start
  • Frage stellen
  • English
  • Impressum

Suchen & Finden

  • Startseite
  • HTML5-Magazine & HTML5-Viewer
  • Fallback-Skript: Flash zu HTML5 - Magazin-Weiterleitung

Fallback-Skript: Flash zu HTML5 – Magazin-Weiterleitung

15. Dezember 2017 von Adam Gagyi

Hinweis: Der Inhalt dieses Artikels richtet sich an Entwickler bzw. Webmaster mit HTML- und ggf. JavaScript-Kenntnissen.

Ausgangssituation:

Sie bieten ein Flash-Magazin an – egal, ob bei 3DZ gehostet, oder als Web-Export – was mit einer Digital Only”-Lizenz erstellt wurde. Da aber die Flash-Unterstützung immer schwieriger wird, wollen Sie einen Fallback zur HTML5-Version des Magazins anbieten.

Dieser Fallback soll global, d.h. auf Desktop- und Mobilgeräten funktionieren.

Lösung

1) Funktionsweise

Legen Sie die HTML-Datei auf Ihren Server und verlinken Sie diese entsprechend. Oder passen Sie das Skript in Ihre eigenen HTML-/ PHP-Dateien etc. entsprechend an.
Beispiel-URL: https://www.beispielwebsite.de/deeplink.html

Ruft der Leser diese URL nun im Browser auf, wird geprüft, ob Flash aktiviert ist für den verwendeten Browser, falls JA, wird die Flash-Version des Magazins geladen. Wenn Flash nicht zur Verfügung steht, wird die HTML5-Version des Magazins geladen.

2) Einsatz: Desktop + Mobil

Da Flash auf mobilen Geräten sowieso nicht zur Verfügung steht, wird so immer direkt die HTML5-Version geladen.

Desktop-Geräte, die noch über Flash verfügen, können die Flash-Version des Magazins somit aber noch anzeigen.

Für eine Übergangszeit (der Hersteller Adobe hat die Entwicklung von Flash eingestellt und fährt die Unterstützung bis 2020 suksessive zurück!) können Sie so sehr elegent Ihren Lesern die bestmögliche Version Ihres Magazins anbieten.

3) Skript und HTML-Beispieldatei:

Hier finden Sie das komplette Fallback-Skript als vollständige HTML-Datei zum Download.

Sie müssen dabei die Werte anpassen URL Flash-­‐Magazin sowie URL HTML5--Magazin → ersetzen Sie diese Platzhalter einfach durch die vollständige URL, inkl. http:// bzw. https://

Sie können auch den Beispiel-Download der obigen .html-Datei verwenden – den Dateinamen, die Platzhalter und sonstige Werte können Sie natürlich ändern. Änderungen des Fallback-Skriptes erfolgen auf eigenes Risiko!

<html>

<head>

    <script type="text/javascript">

        function startMag() {

            // Configuration
            var FlashMag = 'URL Flash-­‐Magazin';
            var HTML5Mag = 'URL HTML5--Magazin';

            var userAgent = '';
            var deepLink = '';


            // Detect user agent 

            if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {

                userAgent = 'iOS';

            } else if (navigator.userAgent.match(/Android/i)) {

                userAgent = 'Android';

            }

            // check if the browser can handle flash
            var hasFlash = false;

            try {
                var flashObject = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');

                if (flashObject) {

                    hasFlash = true;

                }

            } catch (e) {

                if (navigator.mimeTypes

                    && navigator.mimeTypes['application/x-shockwave-flash'] != undefined
                    && navigator.mimeTypes['application/x-shockwave-flash'].enabledPlugin) {
                    hasFlash = true;

                }

            }


            // Check userAgent 
            if (userAgent === 'iOS' && userAgent !== '') {

                deepLink = HTML5Mag;

                // Try to open the HTML5 link    
                window.location = deepLink;

            } else if (userAgent === 'Android' && userAgent !== '') {

                deepLink = HTML5Mag;

                // Try to open the HTML5 link 
                window.location = deepLink;

            } else if (!hasFlash) {

                // Flash can not be handled so we open the html magazine
                window.location = HTML5Mag;

            } else if (FlashMag !== '') {

                deepLink = FlashMag;

                // Other OS 
                window.location = deepLink;

            } else {

                // Error

            }

        }

    </script>

</head>

<body onload="startMag()">

</body>

</html>

 

 

Stichworte: Flash, HTML5, Fallback, Weiterleitung, Script

Letzte Aktualisierung: 15. Dezember 2017
Kategorie: HTML5-Magazine & HTML5-Viewer, Magazin Exportieren
Stichworte: Flash, HTML5, Fallback, Weiterleitung, Script

Leser-Interaktionen

Verwandte Themen

  • HTML5 Fallback Lösung für Flash Magazine
  • Keine Unterstützung mehr von YouTube-Videos in Flash-ePapern (Web)
  • HTML5 Web-Export erstellen und herunterladen
  • Editor-Upload: Flash-Probleme mit Safari 11.0.x und macOS High Sierra 10.13.2
  • Smarticle: HTML5-Vorschau von geclippten Artikeln
  • Startseite
  • Frage stellen
  • Impressum
  • Intern
Urheberrecht © 1994–2021 3D-Zeitschrift GmbH, München

Diese Funktion steht nur angemeldeten 3DZ Mitarbeitern zur Verfügung.

Diese Funktion steht nur angemeldeten 3DZ Mitarbeitern zur Verfügung.