Flutter:Fire Base 存储图像上传的后期初始化错误

Posted

技术标签:

【中文标题】Flutter:Fire Base 存储图像上传的后期初始化错误【英文标题】:Flutter: Late Initialization Error for Fire Base Storage Image Upload 【发布时间】:2021-12-19 06:46:54 【问题描述】:

我正在尝试允许已登录的用户将个人资料图片上传到他们的主页。在我将uploadImage 函数添加到我的代码之前,我能够以用户身份成功登录并在页面顶部打印用户的电子邮件以证明他们确实已登录。现在我已经添加了个人资料图片上传器代码,当我以用户身份登录时,出现以下红屏错误:

LateInitializedError: Field 'imageUrl' has not been initialized.

我已经给 imageUrl Late modifier 认为这将允许代码运行并在运行后期分配变量,但这并没有解决问题。在用户可以上传自己的图片之前,我需要帮助让变量可以为空。这是我正在观看的视频,以了解如何开始此过程:

Flutter Image Upload Tutorial

这是我的代码:

import 'dart:io';
import 'package:commentaries/net/authentication.dart';
import 'package:commentaries/ui/nav.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_storage/firebase_storage.dart';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:permission_handler/permission_handler.dart';

class UserPage extends StatefulWidget 
  const UserPage(Key? key) : super(key: key);

  @override
  _UserPageState createState() => _UserPageState();


class _UserPageState extends State<UserPage> 
  User user = auth.currentUser!;
  late String imageUrl; // A: USER PROFILE PICTURE

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text('$user.email'),
      ),
      body: Column(
        children: [
          (imageUrl != null)
              ? Image.network(imageUrl)
              : const Placeholder(
                  fallbackHeight: 200.0, fallbackWidth: double.infinity),
          const SizedBox(
            height: 20.0,
          ),
          ElevatedButton(
            child: const Text('Upload Image'),
            onPressed: () => uploadImage(),
          ),
          // A: LOGOUT USER HERE
          TextButton(
            child: const Text('Logout'),
            // this removes all previous routes and returns signed out user to the home tab (sign in screen)
            onPressed: () => signOut().then(
              (_) => Navigator.of(context).pushAndRemoveUntil(
                  MaterialPageRoute(builder: (context) => const Nav()),
                  (Route<dynamic> route) => false),
            ),
            // onPressed:()
            //   auth.signOut();
            //   Navigator.of(context).pushReplacement(MaterialPageRoute(builder: (context) => Nav()));
            // ,
          ),
        ],
      ),
    );
  

  uploadImage() async 
    final _storage = FirebaseStorage.instance;
    final _picker = ImagePicker();
    PickedFile image;
    // A: Check permissions
    await Permission.photos.request();
    var permissionStatus = await Permission.photos.status;
    if (permissionStatus.isGranted) 
      // A: Select Image
      // A: future picked file, add await clarification
      image = (await _picker.pickImage(source: ImageSource.gallery)) as PickedFile;
      var file = File(image.path);
      if (image != null) 
        // A: Upload to firebase
        var snapshot = await _storage
          .ref()
          .child('folderName/imageName') // will create folder: folderName and image: imageName
          .putFile(file);
        var downloadUrl = await snapshot.ref.getDownloadURL();
        setState(() 
          imageUrl = downloadUrl;
        );
       else 
        print('No path recieved, no image detected');
      
     else 
      print('App is not permitted to access photo gallery');
    
  

【问题讨论】:

只需将late String imageUrl 更改为String? imageUrl 嗨@adamcapjones,您有机会尝试rickimaru 的建议吗? 是的,这解决了我的问题。谢谢,我不知道这是一项功能 【参考方案1】:

将 rickimaru 的解决方案发布为社区 wiki 以提高知名度:

您需要将late String imageUrl 替换为String? imageUrl 以修复初始化错误。

【讨论】:

以上是关于Flutter:Fire Base 存储图像上传的后期初始化错误的主要内容,如果未能解决你的问题,请参考以下文章

Flutter - 将图像上传到 Firebase 存储

我可以在使用 AWS amplify for Cognito 和 DataStore 的同时使用 fire base 来托管我的 Flutter Web 应用程序吗

Flutter - 将图像上传到 Firebase 存储

Flutter将图像上传到firebase存储然后将其写入firestore

Flutter web - 无法将图像上传到 Firebase 存储

上传前 Flutter 离线图片