iOS 14上的Flutter Web PWA保持打开Safari Web浏览器

我们在https://web.sharezone.net下提供Flutter web。在Android、macOS和Windows（Linux尚未测试）上，我们可以将Flutter Web应用程序安装为PWA。但在iOS上，这是不可能的。在iOS上，Safari会继续在Safari内部打开网站。
但是，可以在Safari上安装Flutter Web应用程序作为PWA，因为您可以使用https://pwa_demo.codemagic.app（Source code）进行尝试。
这是我们的index.html：

<!DOCTYPE html>
<!--
 Copyright (c) 2022 Sharezone UG (haftungsbeschränkt)
 Licensed under the EUPL-1.2-or-later.

 You may obtain a copy of the Licence at:
 https://joinup.ec.europa.eu/software/page/eupl

 SPDX-License-Identifier: EUPL-1.2
-->

<html>

<head>
    <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

    This is a placeholder for base href that will be replaced by the value of
    the `--base-href` argument provided to `flutter build`.
  -->
    <base href="$FLUTTER_BASE_HREF">

    <meta charset="UTF-8">
    <meta content="IE=Edge" http-equiv="X-UA-Compatible">

    <!-- Caching of HTML for about 6 hours-->
    <meta http-equiv="cache-control" content="max-age=21600" />

    <!-- iOS meta tags & icons -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="fix">
    <link rel="apple-touch-icon" href="icons/Icon-192.png">

    <link rel="icon" type="image/png" href="favicon.png">
    <link rel="manifest" href="manifest.json">

    <!-- SEO and SMO -->
    <meta name="description"
        content="Sharezone ist ein vernetzter Schulplaner, mit dem sich Schüler, Lehrkräfte und Eltern gemeinsam, schnell und datenschutzkonform organisieren können.">

    <!-- Favicon -->
    <link rel="icon" type="image/png" href="favicon.png" />

    <title>Sharezone</title>

    <meta name="theme-color" content="#40c4ff">
    <link rel="stylesheet" href="index.css" type="text/css" media="screen,projection">

    <!-- Required for QR Login -->
    <script src="assets/packages/fast_rsa/web/assets/wasm_exec.js" type="application/javascript"></script>

    <!-- Required for Google Sign In -->
    <meta name="google-signin-client_id"
        content="730263787697-s5tqfln3apv1j27netnnv8p8305ns3j9.apps.googleusercontent.com">

    <script>
        // The value below is injected by flutter build, do not touch.
        var serviceWorkerVersion = null;
    </script>
    <!-- This script adds the flutter initialization JS code -->
    <script src="flutter.js" defer></script>
</head>

<body>
    <script>
        window.addEventListener('load', function (ev) {
            // Download main.dart.js
            _flutter.loader.loadEntrypoint({
                serviceWorker: {
                    serviceWorkerVersion: serviceWorkerVersion,
                },
                onEntrypointLoaded: function (engineInitializer) {
                    engineInitializer.initializeEngine().then(function (appRunner) {
                        appRunner.runApp();
                    });
                }
            });
        });
    </script>

    <div class="spinner">
        <div class="double-bounce1"></div>
        <div class="double-bounce2"></div>
    </div>

    <!-- Required for the pdfx package -->
    <script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@2.12.313/build/pdf.js" type="text/javascript"></script>
    <script type="text/javascript">
        pdfjsLib.GlobalWorkerOptions.workerSrc = "https://cdn.jsdelivr.net/npm/pdfjs-dist@2.12.313/build/pdf.worker.min.js";
        pdfRenderOptions = {
            cMapUrl: 'https://cdn.jsdelivr.net/npm/pdfjs-dist@2.12.313/cmaps/',
            cMapPacked: true,
        }
    </script>
</body>

</html>

我们的manifest.json：

{
    "name": "Sharezone",
    "short_name": "Sharezone",
    "start_url": ".",
    "display": "standalone",
    "background_color": "#0175C2",
    "theme_color": "#0175C2",
    "description": "Der vernetzte Schulplaner",
    "orientation": "portrait-primary",
    "prefer_related_applications": false,
    "icons": [
        {
            "src": "icons/Icon-192.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
            "src": "icons/Icon-512.png",
            "sizes": "512x512",
            "type": "image/png"
        },
        {
            "src": "icons/Icon-maskable-192.png",
            "sizes": "192x192",
            "type": "image/png",
            "purpose": "maskable"
        },
        {
            "src": "icons/Icon-maskable-512.png",
            "sizes": "512x512",
            "type": "image/png",
            "purpose": "maskable"
        }
    ]
}

我们的源代码：https://github.com/SharezoneApp/sharezone-app/tree/update-index-html
我们使用Flutter v3。7.10

iOS 14上的Flutter Web PWA保持打开Safari Web浏览器

1条答案

相关问题

热门标签

最新问答