Flutter Web本地化JSON加载返回Null，移动端正常问题排查

Flutter开发的Android移动端本地化功能运行正常，lang目录下的en.json、fr.json等语言资产文件可正常完成翻译，pubspec.yaml配置无误，但Web端运行时抛出「Unexpected null value」错误。替换为硬编码字符串则无问题，说明Web端加载JSON文件时返回了Null值。

本地化加载代码 #

late Map<String, String> _localizedStrings;
Future<bool> load() async {
    String jsonString =
        await rootBundle.loadString('lang/${locale.languageCode}.json');
    Map<String, dynamic> jsonMap = json.decode(jsonString);

    _localizedStrings = jsonMap.map((key, value) {
      return MapEntry(key, value.toString());
    });

    return true;
  }

  String? translate(String key) {
    return _localizedStrings[key];
  }

pubspec.yaml资产配置 #

assets:
    - lang/ 

翻译调用代码 #

child: Text(AppLocalizations.of(context)!.translate("SKIP")!),

问题原因 #

• Web端文件路径大小写敏感：移动端文件系统（Android/iOS）通常不区分文件名大小写，但Web端的资源加载严格遵循大小写匹配。如果lang目录下的文件名是en.json，但代码中因locale解析得到的语言码是大写（比如EN），或者文件名本身大小写不一致，就会导致文件找不到，返回Null。
• 资产文件未正确打包到Web构建产物：执行flutter build web后，检查build/web/assets/lang目录是否存在对应的JSON文件。如果构建过程中资产文件未被复制到该目录，Web端自然无法加载。可以尝试清理构建缓存后重新构建：flutter clean && flutter build web。
• 异步加载未完成就触发翻译：Web端的资源加载速度可能比移动端慢，如果在load()方法还未执行完成时，就调用translate()，此时_localizedStrings虽然是late变量，但实际未完成初始化，访问时会抛出Null错误。建议用FutureBuilder包裹需要本地化的UI，确保加载完成后再渲染。
• rootBundle路径解析差异：少数情况下，Web端的rootBundle对路径的解析和移动端不同，比如是否需要添加assets/前缀。可以尝试把加载路径改为assets/lang/${locale.languageCode}.json，同时确保pubspec中的配置正确。

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