首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Flutter -将图像上传到Firebase存储

Flutter -将图像上传到Firebase存储
EN

Stack Overflow用户
提问于 2018-08-15 11:26:02
回答 11查看 26.1K关注 0票数 23

我从Firebase Storage获取图像,用相机拍照,或从库中挑选一个。当其中一个完成时,我有一个存储Image的类,这样我就可以在需要时使用它。

现在,我需要将此图像上传到Firebase Storage (修改或更新,都无关紧要)。Firebase允许我使用以下之一:putDataputFile,每个都需要一个Uint8ListFile

我怎么才能拿着我的Image并从中获取FileUint8List进行上传呢?

--

或者,为了解决这个问题,当我从Firebase存储中检索我的图像时,如何获取它的File

无论哪种方式,都会导致提供正确的数据类型来上传图像,无论是在开始还是结束时获取一个File

EN

回答 11

Stack Overflow用户

发布于 2018-08-15 13:52:08

当您使用图像拾取器选择一个图像时,它会返回一个文件,您可以使用await等待,直到用户选择一个文件,然后将其存储为文件。下面是一些示例代码,说明如何从图像拾取器获取文件并将其上传到Firebase。

代码语言:javascript
运行
AI代码解释
复制
    FirebaseStorage _storage = FirebaseStorage.instance;

    Future<Uri> uploadPic() async {

    //Get the file from the image picker and store it 
    File image = await ImagePicker.pickImage(source: ImageSource.gallery);  

    //Create a reference to the location you want to upload to in firebase  
    StorageReference reference = _storage.ref().child("images/");

    //Upload the file to firebase 
    StorageUploadTask uploadTask = reference.putFile(file);

    // Waits till the file is uploaded then stores the download url 
    Uri location = (await uploadTask.future).downloadUrl;

    //returns the download url 
    return location;
   }
票数 23
EN

Stack Overflow用户

发布于 2020-04-24 14:14:29

选择图像(画廊、相机..等)首先你可以使用图像拾取器package

然后像这样获取文件格式的图像

代码语言:javascript
运行
AI代码解释
复制
//Get the file from the image picker and store it
final pickedFile = await picker.getImage(source: ImageSource.camera);

  File image;
  if (pickedFile != null) {
    image = File(pickedFile.path);
  } else {
    print('No image selected.');
    return;
  }

然后检测您要保存此文件图像的引用

代码语言:javascript
运行
AI代码解释
复制
FirebaseStorage storage = FirebaseStorage.instance;
//Create a reference to the location you want to upload to in firebase
StorageReference reference = storage.ref().child("profileImages/myImageUid");

最后开始上传并等待完成,然后获取URL图像

代码语言:javascript
运行
AI代码解释
复制
//Upload the file to firebase
        StorageUploadTask uploadTask = reference.putFile(image);
    
        StorageTaskSnapshot taskSnapshot = await uploadTask.onComplete;
    
        // Waits till the file is uploaded then stores the download url
        String url = await taskSnapshot.ref.getDownloadURL();

完整代码

代码语言:javascript
运行
AI代码解释
复制
FirebaseStorage storage = FirebaseStorage.instance;

    File image;
    try {
      //Get the file from the image picker and store it
      image = await ImagePicker.pickImage(source: ImageSource.gallery);

    } on PlatformException catch (e) {
      //PlatformException is thrown with code : this happen when user back with don't
      //selected image or not approve permission so stop method here 
      // check e.code to know what type is happen
      return;
    }

    //Create a reference to the location you want to upload to in firebase
    StorageReference reference =
        storage.ref().child("profileImages/${user.id}");

    //Upload the file to firebase
    StorageUploadTask uploadTask = reference.putFile(image);

    StorageTaskSnapshot taskSnapshot = await uploadTask.onComplete;

    // Waits till the file is uploaded then stores the download url
    String url = await taskSnapshot.ref.getDownloadURL();
票数 5
EN

Stack Overflow用户

发布于 2020-04-17 22:06:58

很抱歉我的回答太晚了,但上面的答案有点陈旧,希望我的答案能对你有所帮助。下面的代码示例将在以下依赖项上工作。

关于这个问题,它说我如何在上传后检索它。您可以使用下载URL来获取文件或图像,您可以下载它,也可以在NetworkImage小部件上显示它,以便向用户显示它。我已经在下面展示了如何获取下载URL。

pubspec.yaml

代码语言:javascript
运行
AI代码解释
复制
dependencies
    image_picker: ^0.6.5
    firebase_storage: ^3.1.5

Dart代码

代码语言:javascript
运行
AI代码解释
复制
//Creating a global Variable    
StorageReference storageReference = FirebaseStorage.instance.ref();
File _image;

void getImage(){
    _image = await ImagePicker.pickImage(source: ImageSource.gallery); 
}

void addImageToFirebase(){


    //CreateRefernce to path.
    StorageReference ref = storageReference.child("yourstorageLocation/");

    //StorageUpload task is used to put the data you want in storage
    //Make sure to get the image first before calling this method otherwise _image will be null.

    StorageUploadTask storageUploadTask = ref.child("image1.jpg").putFile(_image);

     if (storageUploadTask.isSuccessful || storageUploadTask.isComplete) {
          final String url = await ref.getDownloadURL();
          print("The download URL is " + url);
     } else if (storageUploadTask.isInProgress) {

          storageUploadTask.events.listen((event) {
          double percentage = 100 *(event.snapshot.bytesTransferred.toDouble() 
                               / event.snapshot.totalByteCount.toDouble());  
          print("THe percentage " + percentage.toString());
          });

          StorageTaskSnapshot storageTaskSnapshot =await storageUploadTask.onComplete;
          downloadUrl1 = await storageTaskSnapshot.ref.getDownloadURL();

          //Here you can get the download URL when the task has been completed.
          print("Download URL " + downloadUrl1.toString());

     } else{
          //Catch any cases here that might come up like canceled, interrupted 
     }

}
票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51857796

复制
相关文章
iOS-将项目上传到 GitHub 上
创建项目 进入GitHub主页,创建新代码仓库,注册相关事宜不再赘述(见下图): 二、给你的新代码仓库起名称(可以是项目的名称或者 Demo 的文件名称)--->给你仓库添加描述(方便别人理解用途)--->点击“创建”(见下图): 步骤二.png 三、点击“创建”后会生成相应的 github 网址,这个网址就是以后上传项目的地址(见下图): 步骤三.png 四、接着用 Xcode 创建工程,记得勾选创建 Git 代码仓库(见下图): 步骤四.png 五、在导航栏找到“配置工程”选项(见下
用户1890628
2018/05/10
2.6K0
如何将IDEA上的项目上传到GitHub上?
最近,找到了一个去年用Springboot完成的一个web类博客项目,于是想到了上传到GitHub上开源分享。相信还有一部分刚入"IT"圈的编程小白(请忽略我也是一个菜鸟…),于是正好利用这个机会做一期记录。
大数据梦想家
2021/01/27
6.9K0
如何将IDEA上的项目上传到GitHub上?
Fabric.js 将本地图像上传到画布背景
这次要实现的效果是:在本地上传一张图片,然后渲染到 canvas 里(当做背景图)。
德育处主任
2022/04/17
2.8K0
Fabric.js 将本地图像上传到画布背景
flutter中多flavors方案以及添加firebase​
有想做海外市场的同学们,可能需要用到firebase。今天我们讲讲怎么使用「FlutterFire CLI」添加 firebase以及如何设置「flavors」
用户1974410
2022/09/20
10K0
flutter中多flavors方案以及添加firebase​
使用helm将本地部署文件上传到harbor chart上
在执行install.sh安装脚本时,通过--with-chartmuseum参数安装chart插件。
章工运维
2023/06/13
2.7K0
使用helm将本地部署文件上传到harbor chart上
将代码传到github公库
Github顾名思义是一个Git版本库的托管服务,是目前全球最大的软件仓库,拥有上百万的开发者用户,也是软件开发和寻找资源的最佳途径 ,Github不仅可以托管各种Git版本仓库,还拥有了更美观的Web界面,您的代码文件可以被任何人克隆 ,使得开发者为开源项贡献代码变得更加容易,当然也可以付费购买私有库,这样高性价比的私有库真的是帮助到了很多团队和企业
星哥玩云
2022/09/15
4460
将代码传到github公库
如何在 1 秒内将 50 个 OpenCV 帧上传到云存储
在这个现代世界中,我认为我们大多数人都熟悉使用计算机视觉应用程序的新行业,特别是闭路电视监控摄像头和视频分析,它们在计算机视觉技术中发挥着重要作用。
小白学视觉
2022/02/14
4720
如何在 1 秒内将 50 个 OpenCV 帧上传到云存储
利用Git工具将本地创建的项目上传到Github上
作为一个对前沿技术很看好的小青年,怎么能不会用Github呢?一年前我创建了Github,也知道git,但是尝试过用,但是就没弄明白,很多粉丝都问我Github的账号,想关注一波,无奈里面啥都没有,因此必须学习一下并且写点东西进去,Google了很多东西,尝试了很多次,最后还是成了,以下将分享下我的经验随笔~~~
Angel_Kitty
2018/08/01
2.5K0
利用Git工具将本地创建的项目上传到Github上
firebase怎么用_firebase是什么
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/168361.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/20
4.3K0
firebase怎么用_firebase是什么
Flutter 3.7 新特性:介绍后台isolate通道
此时此刻,我很高兴地宣布从 Flutter 3.7 开始开发人员可以在任意 isolate 中使用插件和平台通道了。 这是自 2018 年以来一直存在并且也是我们排名最高的问题之一。它被降低了优先级,因为实现并不容易且已存在解决方案,尽管很麻烦:始终在 root isolate(Flutter 提供的 isolate)中使用插件 . 然而,随着 Flutter 的日益成熟,越来越关注性能,俗话说“让它工作,让它正确,让它快速”。 选择实现这一特征有利于提高性能和易用性。 因此,考虑带来的收益我们决定实现这一特性。
睡觉谁叫
2023/02/10
4.3K0
Flutter 3.7 新特性:介绍后台isolate通道
将项目上传到gitee仓库
一,进入gitee官网,登录新建一个仓库。 gitee官网:https://gitee.com/ 二,输入仓库名称,介绍等信息,点击创建。 三,根据命令行提示进入项目创建git仓库。 操作步骤 可以进入项目文件目录,找到文件右键git打开控制台。一步步输入上面红色框中的命令即可。 四,使用IDEA打开刚才的项目,右键 -> git -> add添加到仓库 然后提交并推送到仓库;以后每次修改了项目记得提交到远程仓库保存,如果是团队开发,记得先拉取一下代码再提交,防止代码冲突。 五,然
张苹果
2022/09/22
9290
将项目上传到gitee仓库
swift将framework上传到Cocoapods
.podspec文件的作用是为了让CocoaPods搜索引擎知道该代码的作者、版本号、概要、描述、源代码地址、部署版本、依赖的框架等描述信息。
用户6094182
2019/08/23
9910
swift将framework上传到Cocoapods
如何将firebase应用转为supabase应用(之一)
用supabase实时数据库替换mapus协作地图里的firebase_q平面人的博客-CSDN博客
hotqin888
2022/11/16
5.6K0
Flutter 2.8正式版发布了,还不来看看
在2021年12月上旬,Flutter官方发布了今年的第四个正式版本,也是今年的最后一个Flutter稳定版。
CrazyCodeBoy
2022/01/04
22.8K0
Flutter 2.8正式版发布了,还不来看看
TensorFlow Lite,ML Kit 和 Flutter 移动深度学习:6~11
认证是任何应用中最突出的功能之一,无论它是本机移动软件还是网站,并且自从保护数据的需求以及与机密有关的隐私需求开始以来,认证一直是一个活跃的领域。 在互联网上共享的数据。 在本章中,我们将从基于 Firebase 的简单登录到应用开始,然后逐步改进以包括基于人工智能(AI)的认证置信度指标和 Google 的 ReCaptcha。 所有这些认证方法均以深度学习为核心,并提供了一种在移动应用中实现安全性的最新方法。
ApacheCN_飞龙
2023/04/27
23.4K0
TensorFlow Lite,ML Kit 和 Flutter 移动深度学习:6~11
如何将你的Hexo博客部署到Google Firebase上
博主最近在 白嫖万恶的资本 将博客部署到新的CDN上,所以在寻找免费的静态Web应用部署工具,发现了Google Firebase。
pai233
2022/04/26
1.4K0
如何将你的Hexo博客部署到Google Firebase上
Flutter 3.0正式发布:稳定支持6大平台,字节跳动是主要用户
5 月 12 日,Flutter 3.0 在 Google I/O 开发者大会正式亮相,随着 3.0 版本的发布,Flutter 开发框架终于可以支持六大平台,实现了其跨平台稳定运行的愿景。
深度学习与Python
2022/06/11
7.6K0
Flutter 3.0正式发布:稳定支持6大平台,字节跳动是主要用户
将 Discuz! 论坛远程附件存储到腾讯云对象存储COS上
Discuz! 论坛可以通过配置远程附件功能将论坛的附件保存在腾讯云 COS 上,将论坛附件保存在 COS 上有以下好处:
云存储
2020/01/08
8K2
将 Discuz! 论坛远程附件存储到腾讯云对象存储COS上
iOS-将项目上传到 Git.OSChina 上,创建自己的私有项目
为什么要将项目上传到 Git.OSChina 上 GitHub上创建私有项目是收费的 git.oschina上可以创建1000个免费的项目 服务器在国内,速度比GitHub快 ---- 登录 git.oschina.net ---- 配置 SSHKey 为什么要配置SSHKey 客户端与服务器进行通信的时候要保证安全,就需要在客户端配置私钥,在服务端配置公钥 SSHKey就是来配置公钥和私钥 客户端负责生成私钥和公钥 将公钥传递给服务器 工作原理 客户端发起一个请求到服务端 服务端接到请
用户1890628
2018/05/10
1.5K0
点击加载更多

相似问题

Flutter -将图像上传到Firebase存储

10

Flutter:将图像上传到Firebase存储

20

将图像从flutter上传到firebase存储

129

Flutter + Firebase -将图像文件上传到存储中

12

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

242
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档