Flutter Web如何获取PWA安装状态布尔值及调用SQLite等本地数据库

1. 判断PWA是否已本地安装 #

你需要的布尔值可以通过浏览器提供的运行模式检测接口获取，Flutter Web 中可以直接调用 Web API 实现，代码如下：

import 'package:flutter/foundation.dart';
import 'dart:html' as html;

bool checkPWAInstalled() {
  // 非Web环境直接返回false
  if (!kIsWeb) return false;
  // 检测标准PWA独立窗口运行模式
  bool isStandalone = html.window.matchMedia('(display-mode: standalone)').matches;
  // 兼容iOS Safari下的PWA运行模式检测
  bool isIOSStandalone = html.window.navigator.standalone ?? false;
  return isStandalone || isIOSStandalone;
}

这个方法直接返回布尔值，符合你给出的逻辑判断需求。 #

2. PWA安装后使用本地数据库的方案 #

受浏览器环境限制，Flutter Web 无法直接使用原生SQLite，推荐以下几种成熟的本地持久化方案：

• Hive：纯Dart实现的轻量NoSQL数据库，原生支持Flutter Web，无需额外适配，性能优秀，支持数据加密，适合绝大多数普通业务场景。
• sqflite_common_ffi_web：如果你需要使用SQLite语法，该库基于SQLite WASM实现，兼容sqflite的常用API，数据会持久化存储在浏览器IndexedDB中，几乎无迁移成本。
• IndexedDB：浏览器原生提供的高性能本地数据库，支持大容量数据存储，可以直接通过dart:html调用，也可以使用idb_sqflite等封装库简化操作。

所有本地存储方案都受浏览器存储配额限制，常规场景下有几十GB的可用空间，足够满足普通PWA的使用需求。 #

完整示例逻辑实现 #

import 'package:flutter/foundation.dart';
import 'dart:html' as html;

void initStorageStrategy() {
  if (checkPWAInstalled()) {
    print('Use local database');
    // 在此处初始化Hive/sqflite_common_ffi_web等本地数据库
  } else {
    print('Use server storage');
    // 在此处调用服务端存储相关逻辑
  }
}

bool checkPWAInstalled() {
  if (!kIsWeb) return false;
  bool isStandalone = html.window.matchMedia('(display-mode: standalone)').matches;
  bool isIOSStandalone = html.window.navigator.standalone ?? false;
  return isStandalone || isIOSStandalone;
}

内容的提问来源于stack exchange，提问作者Mehran Ullah