Flutter选取相册图片报错 无法获取图片URL存入Firestore

报错根因 #

两个报错分别对应两处代码问题：

• 类型转换异常：ImagePicker.platform.pickImage 接口返回值为PickedFile类型，代码中直接强转为File类型，触发类型不匹配错误
• URI解析异常：未选中图片的兜底逻辑使用NetworkImage("null")，传入的"null"不是合法的网络图片URI，系统解析时找不到对应主机地址抛出错误

修复方案 #

1. 调整选图后的赋值逻辑：不要直接强转返回值，取返回的PickedFile实例的path属性构造File对象，同时增加用户取消选图的空值判断，避免空指针
2. 替换无效的占位图逻辑：不要传入"null"作为网络图片地址，可使用本地资源图、默认图标作为未选图状态的占位展示

修复后完整代码 #

import 'dart:io';
import 'package:image_picker/image_picker.dart';

// 选图结果变量
File? image;

Future getImage() async {
  final pickedFile = await ImagePicker.platform.pickImage(source: ImageSource.gallery);
  // 用户取消选图时直接返回，不执行后续状态更新
  if (pickedFile == null) return;
  setState(() {
    // 通过PickedFile的文件路径构造File实例
    image = File(pickedFile.path);
  });
}

// 头像选图组件
InkWell(
  child: CircleAvatar(
    backgroundImage: image != null
        ? FileImage(image!)
        // 替换无效的null网络地址，可替换为项目内的默认头像资源
        : const AssetImage("assets/default_avatar.png") as ImageProvider,
    radius: 100,
  ),
  onTap: () {
    getImage();
  },
)

补充说明：如果不想引入本地占位资源，也可以用以下写法简化占位逻辑，彻底避免无效URI问题：

CircleAvatar(
  radius: 100,
  backgroundImage: image != null ? FileImage(image!) : null,
  child: image == null ? const Icon(Icons.add_photo_alternate, size: 40) : null,
)

如果后续升级image_picker到0.8.0及以上版本，选图接口调整为ImagePicker().pickImage()，返回值为XFile类型，处理逻辑不变，取XFile实例的path属性构造File即可。后续要上传图片到存储、拿到URL写入Firestore时，直接传入image实例对应文件即可。

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