Flutter插件中InAppWebView在iOS无法加载本地HTML的问题

1. 正确配置插件的资源声明 #

在插件根目录的pubspec.yaml中，确保已正确声明本地HTML所在的assets目录：

flutter:
  assets:
    - assets/web/  # 替换为你实际的HTML文件所在目录

注意：不要将HTML文件放在lib目录下，该目录仅用于源码，不会被打包为资源文件。

2. 配置iOS端资源打包规则 #

修改插件ios目录下的your_plugin_name.podspec文件，添加资源bundle配置，确保iOS将插件assets打包到framework中：

s.resource_bundles = {
  'YourPluginName' => ['assets/web/**/*']  # 替换为插件名称和资源路径
}

替换YourPluginName为你的插件实际名称，assets/web/**/*匹配该目录下所有文件。

3. 正确加载本地HTML文件 #

由于iOS插件的assets存储在独立bundle中，直接使用initialFile可能路径识别失败，推荐将assets文件复制到临时目录后加载：

import 'dart:io';
import 'package:flutter/services.dart';
import 'package:path_provider/path_provider.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';

// 加载本地HTML的工具方法
Future<Uri> getLocalHtmlUri() async {
  final assetPath = 'assets/web/index.html'; // 你的HTML文件路径
  final byteData = await rootBundle.load(assetPath);
  final tempDir = await getTemporaryDirectory();
  final file = File('${tempDir.path}/index.html');
  await file.writeAsBytes(byteData.buffer.asUint8List());
  return Uri.file(file.path);
}

// 在InAppWebView中使用
InAppWebView(
  initialUrlRequest: URLRequest(
    url: await getLocalHtmlUri(),
  ),
  onLoadStart: (controller, url) {
    print('开始加载: $url');
  },
  onLoadStop: (controller, url) {
    print('加载完成: $url');
  },
  onLoadError: (controller, url, code, message) {
    print('加载错误: $message');
  },
)

4. 排查回调与环境问题 #

• 确认所有回调（onLoadStart、onLoadStop、onLoadError）已正确绑定，避免因回调未设置误以为加载无反应。
• 检查文件名和路径的大小写：iOS系统区分文件名大小写，确保代码中的路径与实际文件名完全一致。
• 清理缓存并重建项目：执行flutter clean，进入ios目录执行pod install，再重新运行项目，避免缓存导致的资源未更新问题。

内容的提问来源于stack exchange，提问作者Cyrus the Great