将 base64 转换为文件后，应用程序显示错误的文件

Question

我正在尝试将 Uint8List 转换为文件。

TL;DR：我的后端向我发送了一个 base64 字符串，我试图在我的应用程序中显示它。

What's the problem?

我第一次看到我的头像
我更改了我的个人资料图片并将其发送到我的后台，后台获取新的个人资料图片并保存
我重新加载屏幕并显示旧的个人资料图片，当我调试并检查后端发送的 base64 字符串时，我可以看到我正在接收新的个人资料图片，即使显示的是旧的
为了查看我的更改，我手动重启了应用程序

About the code

widget.profilePicture 有 base64 字符串
_storedImage 是我在我的应用程序中显示的内容
'${tempPath.path}/profile.png'是我存放缓存的地方，这部分我在这个question

    File _storedImage;
    Future _initialImage;
    final imagePicker = ImagePicker();
    
    @override
    void initState() {
      _initialImage = _initiateStoredImage();
      super.initState();
    }
    
    Future _initiateStoredImage() async {
      Uint8List bytes = base64Decode(widget.profilePicture);
    
      final tempPath = await syspaths.getTemporaryDirectory();
    
      _storedImage = File('${tempPath.path}/profile.png');
      await _storedImage.writeAsBytes(
          bytes.buffer.asUint8List(bytes.offsetInBytes, bytes.lengthInBytes));
    }

我用这个方法存储图片

Future _getImage(bool fromCamera) async {
    final ImagePicker picker = ImagePicker();
    final pickedFile = await picker.getImage(
        source: fromCamera ? ImageSource.camera : ImageSource.gallery);
    File imageFile;
    if (pickedFile != null) {
      imageFile = File(pickedFile.path);
    } else {
      return;
    }
    setState(() {
      if (pickedFile != null) {
        _storedImage = imageFile;
      }
    });
    final tempPath = await syspaths.getTemporaryDirectory();
    final savedImage = await imageFile.copy('${tempPath.path}/profile.png');
    widget.onSelectImage(savedImage);
  }

我使用此小部件渲染图像

FutureBuilder(
  future: _initialImage,
  builder: (_, dataSnapshot) {
    if (dataSnapshot.connectionState ==
        ConnectionState.waiting) {
      return Center(child: CircularProgressIndicator());
    } else {
      if (dataSnapshot.error != null) {
        return Center(
          child: Text('Algo salio mal'),
        );
      } else {
        return Container(
          width: 150.0,
          height: 150.0,
          decoration: BoxDecoration(
            shape: BoxShape.circle,
            image: DecorationImage(
                image: _storedImage != null
                    ? FileImage(_storedImage)
                    : AssetImage(
                        "assets/images/default-avatar.png"),
                fit: BoxFit.cover,
                alignment: Alignment.center),
          ),
        );
      }
    }
  },
),

Answer 1

Flutter 的 ImageCache 基于文件路径缓存 FileImage。如果您覆盖原始文件，路径不会改变，因此 Flutter 将继续绘制缓存的图像。在这种情况下，您需要先调用 evict method 来删除缓存版本。

将 base64 转换为文件后，应用程序显示错误的文件

App showing wrong File, after converting base64 to File

mobile

dart

flutter