【问题标题】:How To Run a Flutter Web Application Offline?如何离线运行 Flutter Web 应用程序?
【发布时间】:2021-07-17 01:26:03
【问题描述】:

我从雇主那里得到了一个有问题的任务。 我的任务是开发可以在 Google Chrome 上严格运行的简单软件, 不尝试连接到网络(安全原因)。

我了解 Flutter 开发,并且对 sdk 感到满意。 我应该如何开发一个可以使用 U 盘部署的 Web 应用程序? 看起来 PWA 可以作为一个选项,但文档缺乏详细信息。

  • 系统无法运行本地 Web 服务器。
  • Flutter 应用必须能够使用 JS 库,我打算使用 jsQR。

【问题讨论】:

  • 在此期间您找到解决方案了吗?我正在努力解决一个非常相似的问题

标签: javascript flutter flutter-web wpa


【解决方案1】:

service worker 和 indexedDB 可以帮助您开发离线路由应用和离线 api。

mdn docs for service workers

【讨论】:

    【解决方案2】:

    我不确定这是否适合您的具体情况:您说系统无法运行本地网络服务器,但如果您将网络服务器与您的软件一起提供呢?

    我刚刚发现get_server:你可以找到它here。它旨在允许开发人员仅使用 Flutter 来托管自己的 HTTP 服务器,而无需借助外部工具或其他编码/脚本语言。它还允许(这是相关部分)包装您的 Flutter Web 应用程序并使其在本地网络上运行。

    目前我只尝试了一个非常简单的示例,但它似乎可以正常工作。这些是我采取的步骤:

    • 创建一个新的 Flutter 项目:因为我需要在 Windows 上运行 Web 服务器,所以我必须为此做好 Flutter 准备(请参阅 here 以获得帮助)

    • get_server 添加到新的 pubspec.yaml

    • 在您的 Flutter Web 项目上运行 flutter build web,并复制 build/web 输出 新项目根文件夹中的文件夹(我在复制时重命名了文件夹,因为颤动可能会改变web文件夹的内容)

    • 删除lib/main.dart的所有内容

    • 粘贴这个(这是main.dart的实际内容)

      import 'package:get_server/get_server.dart' as gs;
      void main() {
        gs.runApp(
          gs.GetServerApp(home: gs.FolderWidget('folderName')),
        );
      }
      

    folderName 是包含 Flutter Web 应用构建的重命名文件夹的名称。

    我在 AndroidStudio 的 Windows '设备' 上运行了这个,我的原始 Flutter Web 应用程序可以通过localhost:8080 访问(现在我只使用get_server 的默认选项)。我还将 webserver(空)GUI 作为一个白色窗口:我想这对于有关服务器本身的一些信息很有用,但是,如果该窗口关闭,localhost:8080 将变得不可用。 但是,一旦发布,您应该能够从 U 盘运行可执行文件,然后使用 Chrome 连接到它。

    PS:在使用 GetServer 一段时间后,由于文档和支持不太好,我不得不切换到其他软件包。现在我使用的是shelf,但值得注意的是Alfred

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-11-18
      • 2020-01-05
      • 2021-01-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-06-25
      相关资源
      最近更新 更多