Flutter打包APK后无法加载Cloudinary图片问题排查

我在Flutter项目中通过Cloudinary加载网络图片，为减小安装包体积，使用flutter build apk --split-per-abi命令生成拆分ABI的APK。但安装该APK后图片无法显示，直接调试运行（flutter run）时图片显示正常。

相关代码如下：

import 'package:faker/faker.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    var faker = Faker();
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Test Scroll'),
        ),
        body: Scrollbar(
          child: ListView.builder(
            padding: const EdgeInsets.all(15),
            itemCount: 1000,
            itemBuilder: (context, index) {
              return Container(
                height: 200,
                padding: const EdgeInsets.symmetric(vertical: 10),
                child: Row(
                  children: [
                    Image.network(
                      'https://res.cloudinary.com/tmart/image/upload/v1673656769/xnmqxoeruaq2yddwevpk.jpg',
                    ),
                    Text(faker.person.name()),
                  ],
                ),
              );
            },
          ),
        ),
      ),
    );
  }
}

问题原因 #

拆分ABI打包时，网络图片加载依赖的部分原生库可能未被正确打包到对应架构的APK中，导致底层加载逻辑失效。而调试模式下Flutter会使用完整的原生库集合，因此不会出现问题。

解决方法 #

• 补充ABI配置
  打开android/app/build.gradle，在defaultConfig的ndk块中明确指定支持的ABI，确保所有需要的架构都被包含：

  android {
      defaultConfig {
          // 其他配置...
          ndk {
              abiFilters 'armeabi-v7a', 'arm64-v8a', 'x86', 'x86_64'
          }
      }
  }
  

• 调整R8压缩规则
  若启用了R8代码压缩，可能误删了网络请求或图片加载相关类。在android/app/proguard-rules.pro中添加以下规则：

  -keep class okhttp3.** { *; }
  -keep class okio.** { *; }
  -keep class com.cloudinary.** { *; }
  

• 对比完整APK测试
  先用flutter build apk生成未拆分的完整APK安装测试，如果图片正常显示，即可确认问题源于拆分ABI的打包配置。

• 升级Flutter版本
  部分旧版Flutter存在拆分ABI时原生库打包不全的bug，升级到最新稳定版可大概率解决该问题。

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