[英]Upload image picked from Flutter web to firebase storage and to Firestore
我能够使用代码从 flutter web 获取图像:
Uint8List uploadedImage;
_startFilePicker() async {
InputElement uploadInput = FileUploadInputElement();
uploadInput.click();
uploadInput.onChange.listen((e) {
// read file content as dataURL
final files = uploadInput.files;
if (files.length == 1) {
final file = files[0];
FileReader reader = FileReader();
reader.onLoadEnd.listen((e) {
setState(() {
uploadedImage = reader.result;
});
});
reader.onError.listen((fileEvent) {
setState(() {
Text( "Some Error occured while reading the file");
});
});
reader.readAsArrayBuffer(file);
}
});
}
Widget uploadImage() {
return Container(
width: 530,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
uploadedImage == null ? CircleAvatar(
radius: 60,
backgroundColor: Colors.grey[100],
backgroundImage: AssetImage('assets/images/profileavatar.png'),
):
CircleAvatar(
radius: 65,
backgroundImage: AssetImage('assets/images/backgroundslide.gif'),
child: CircleAvatar(
radius: 60,
backgroundImage: MemoryImage(uploadedImage),
),
) ,
SizedBox(
width: 20,
),
uploadedImage == null ? RaisedButton(
color: Colors.orange,
onPressed: () {
_startFilePicker();
},
child: Text(
'Aggiungi un immagine profilo',
style: TextStyle(color: Colors.white, fontSize: 12),
),
): RaisedButton(
color: Colors.orange,
onPressed: () {
_startFilePicker();
},
child: Text(
'Modifica immagine profilo',
style: TextStyle(color: Colors.white, fontSize: 12),
),
),
],
),
);
}
这样我就成功地从桌面获得了图像。 现在我需要将此图像上传到 flutter 中的存储并进入 Firestore 中的集合:
var firebaseUser = FirebaseAuth.instance.currentUser;
Future<Uri> uploadImageFile(html.File uploadedImage,
{String imageName}) async {
fb.StorageReference storageRef = fb.storage().ref('images/$imageName');
fb.UploadTaskSnapshot uploadTaskSnapshot = await storageRef.put(uploadedImage).future;
await FirebaseFirestore.instance.collection('ifUser').doc(firebaseUser.uid)
.update({"avatarImage": uploadImageFile(uploadedImage),});
Uri imageUri = await uploadTaskSnapshot.ref.getDownloadURL();
return imageUri;
}
当我调用 function uploadImageFile(uploadedImage);
我得到错误:
参数类型“Uint8List”不能分配给参数类型“文件”。 这是正确的方法吗?
将此行更改为:
fb.UploadTaskSnapshot uploadTaskSnapshot = await
storageRef.put(uploadedImage).future;
至:
fb.UploadTaskSnapshot uploadTaskSnapshot = await
storageRef.putData(uploadedImage).future;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.