Flutter:文件上传与下载(下载后预览)

这篇具有很好参考价值的文章主要介绍了Flutter:文件上传与下载(下载后预览)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

Dio

dio是一个强大的Dart Http请求库,提供了丰富的功能和易于使用的API,支持文件上传和下载。
这个就不介绍了,网上有很多的封装案例。

background_downloader

简介
适用于iOS,Android,MacOS,Windows和Linux的后台文件下载器和上传器。

官方文档
https://pub-web.flutter-io.cn/packages/background_downloader

安装

flutter pub add background_downloader

示例1:下载

class _MyHomePageState extends State<MyHomePage> {
  // 文件信息
  String fileInfo = '';
  // 下载进度
  double progress = 0.0;
  // 任务状态
  String taskStatus = '';
  // 任务
  late DownloadTask task;

  // 下载单个文件
  _downloadFile() async {
    task = DownloadTask(
        url:
            'https://vd3.bdstatic.com/mda-ma6igm4b0znfbqve/sc/cae_h264_nowatermark/1609998111/mda-ma6igm4b0znfbqve.mp4', // 下载地址
        // urlQueryParameters: {'q': 'pizza'},  // 请求参数
        filename: 'mov_bbb.mp4', // 文件名
        //headers: {'myHeader': 'value'},  请求头
        directory: 'my_sub_directory', // 文件存储目录
        updates: Updates.statusAndProgress, // 更新任务状态和下载进度
        requiresWiFi: true, // 使用wifi
        retries: 5, // 下载的重试次数
        allowPause: true, // 运行暂停
        metaData: 'data for me' // 元数据,可以存储一些对于下载任务有用的信息,方便后续相关操作
        );
    // 监听下载
    final result =
        await FileDownloader().download(task, onProgress: (progress) {
      setState(() {
        this.progress = progress;
      });
    }, onStatus: (states) {
      String msg = '';
      if (states == TaskStatus.complete) {
        msg = '下载完成';
        //  下载完成后,将文件移动到共享目录后,其他应用也可以访问。否则只能在本应用内访问
        FileDownloader().moveToSharedStorage(task, SharedStorage.downloads);
      } else if (states == TaskStatus.canceled) {
        msg = '已取消';
        setState(() {
          progress = 0;
        });
      } else if (states == TaskStatus.paused) {
        msg = '已暂停';
      } else if (states == TaskStatus.running) {
        msg = '下载中...';
      } else {
        msg = '下载失败';
      }
      setState(() {
        taskStatus = msg;
      });
    });
  }

  
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Theme.of(context).colorScheme.inversePrimary,
          title: Text(widget.title),
        ),
        body: Column(
          children: [
            const SizedBox(
              height: 20,
            ),
            Text("文件信息:$fileInfo"),
            const SizedBox(
              height: 20,
            ),
            Row(
              children: [
                const Text("下载进度:"),
                Expanded(
                    child: LinearProgressIndicator(
                  value: progress,
                  backgroundColor: Colors.greenAccent,
                  valueColor: const AlwaysStoppedAnimation<Color>(Colors.red),
                )),
                Text("${(progress * 100).toStringAsFixed(1)}%")
              ],
            ),
            Text("任务状态:$taskStatus"),
            const SizedBox(
              height: 20,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              mainAxisSize: MainAxisSize.max,
              children: [
                ElevatedButton(
                    onPressed: _downloadFile, child: const Text("下载")),
                ElevatedButton(
                    onPressed: () async {
                      // 暂停任务
                      await FileDownloader().pause(task);
                    },
                    child: const Text("暂停")),
                ElevatedButton(
                    onPressed: () async {
                      //  根据固定的任务id取消
                      await FileDownloader().cancelTaskWithId(task.taskId);
                      // 取消所有
                      //FileDownloader().cancelTasksWithIds(taskIds)
                    },
                    child: const Text("取消")),
                ElevatedButton(
                    onPressed: () async {
                      await FileDownloader().resume(task);
                    },
                    child: const Text("恢复"))
              ],
            )
          ],
        ));
  }
}

注意:

  • 默认下载的文件是在本应用内,其他应用无访问权限。要想要被访问到需要在下载完成后执行 FileDownloader().moveToSharedStorage(task, SharedStorage.downloads);
  • 点击暂停后,再点击恢复可以继续下载。点击取消后,再点击恢复无法继续下载。

Flutter:文件上传与下载(下载后预览),dart 和 Flutter,flutter

Flutter:文件上传与下载(下载后预览),dart 和 Flutter,flutter

示例2:上传

/// define the multi-part upload task (subset of parameters shown)
final task = UploadTask(
        url: 'https://myserver.com/uploads',
        filename: 'myData.txt',
        fields: {'datafield': 'value'},
        fileField: 'myFile', 
        updates: Updates.statusAndProgress // request status and progress updates
);

// Start upload, and wait for result. Show progress and status changes
// while uploading
final result = await FileDownloader().upload(task,
  onProgress: (progress) => print('Progress: ${progress * 100}%'),
  onStatus: (status) => print('Status: $status')
);

// Act on result, similar to download

这个没有服务器,没有尝试,上面的是官方例子。

示例3:批量下载

final tasks = [task1, task2, task3]; // a list of Download tasks

// download the batch
final result = await FileDownloader().downloadBatch(tasks,
  batchProgressCallback: (succeeded, failed) =>
    print('Completed ${succeeded + failed} out of ${tasks.length}, $failed failed')
);

使用DownloadTask会返回一个任务,多个任务可以使用downloadBatch来进行批量下载。

示例4:发起通知

按照官方例子试了一下,一直没有发起通知。
我这里的问题是app没有通知权限,在设置里也无法开启通知。
如果你也没有成功的话,可以使用flutter_local_notifications来实现通知功能
Flutter:flutter_local_notifications——消息推送的学习
Flutter:文件上传与下载(下载后预览),dart 和 Flutter,flutter

示例5:打开下载文件

  _downloadFile() async {
    task = DownloadTask(
        url:
        'https://ppt.1ppt.com/uploads/soft/2307/1-230H1092638.zip', // 下载地址
        // urlQueryParameters: {'q': 'pizza'},  // 请求参数
        filename: '1-230H1092638.zip', // 文件名
        //headers: {'myHeader': 'value'},  请求头
        directory: 'my_sub_directory', // 文件存储目录
        baseDirectory: BaseDirectory.applicationSupport,
        updates: Updates.statusAndProgress, // 更新任务状态和下载进度
        requiresWiFi: true, // 使用wifi
        retries: 5, // 下载的重试次数
        allowPause: true, // 运行暂停
        metaData: 'data for me' // 元数据,可以存储一些对于下载任务有用的信息,方便后续相关操作
    );
    // 监听下载
    final result =
    await FileDownloader().download(task, onProgress: (progress) {
      setState(() {
        this.progress = progress;
      });
    }, onStatus: (states) async{
      String msg = '';
      if (states == TaskStatus.complete) {
        msg = '下载完成';
        await FileDownloader().openFile(task: task);
        print("路径:${await task.filePath()}");
      } else if (states == TaskStatus.canceled) {
        msg = '已取消';
        setState(() {
          progress = 0;
        });
      } else if (states == TaskStatus.paused) {
        msg = '已暂停';
      } else if (states == TaskStatus.running) {
        msg = '下载中...';
      } else {
        msg = '下载失败';
      }
      setState(() {
        taskStatus = msg;
      });
    });

  }

注意:

  • 必须要添加 baseDirectory: BaseDirectory.applicationSupport,,否则是无法打开文件的
  • 如果要打开文件,那么就不能使用FileDownloader().moveToSharedStorage(task, SharedStorage.downloads);移动文件,会导致找不到文件进而打不开。另外打开文件时会调用你手机里有的应用程序打开,我试了一下图片、mp4下载完成后是可以直接打开的,但是zip这样的文件是无法直接打开的,这时会让你选择你手机里的应用来打开。

遇到的问题

Flutter:文件上传与下载(下载后预览),dart 和 Flutter,flutter
这是因为background_downloader要求最小的sdk版本是24,而Flutter会自动设置minSdkVersion为16(Android 4.1),在你的Flutter项目的android/app/build.gradle文件中,将minSdkVersion更改为24或更高的版本。然后运行flutter clean清理项目,并重新构建你的应用程序。
Flutter:文件上传与下载(下载后预览),dart 和 Flutter,flutter
从flutter仓库找到了该问题的解决方案:https://github.com/flutter/flutter/issues/119247

android / app/build.gradle文件中添加文章来源地址https://www.toymoban.com/news/detail-641019.html

configurations.all {
    resolutionStrategy {
        eachDependency {
            if ((requested.group == "org.jetbrains.kotlin") && (requested.name.startsWith("kotlin-stdlib"))) {
                useVersion("1.8.0")
            }
        }
    }
}

到了这里,关于Flutter:文件上传与下载(下载后预览)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Flutter系列文章-Flutter环境搭建和Dart基础

    Flutter是Google推出的一个开源的、高性能的移动应用开发框架,可以用一套代码库开发Android和iOS应用。Dart则是Flutter所使用的编程语言。让我们来看看如何搭建Flutter开发环境,并了解Dart语言的基础知识。 1. 安装Flutter SDK 首先,访问Flutter官网下载Flutter SDK。选择适合你操作系统

    2024年02月15日
    浏览(35)
  • Flutter笔记:关于Flutter中的大文件上传(上)

    Flutter笔记 关于Flutter中的大文件上传(上) 大文件上传背景与 Flutter 端实现文件分片传输 作者 : 李俊才 (jcLee95):https://blog.csdn.net/qq_28550263 邮箱 : 291148484@163.com 本文地址 :https://blog.csdn.net/qq_28550263/article/details/134302751 本系列上下两篇文章,包括 Flutter 端和 Django 端(后

    2024年02月03日
    浏览(38)
  • flutter开发实战-文件上传及上传队列

    flutter开发实战-文件上传及上传队列 之前开发中遇到了发帖子图片上传,上传到七牛。 上传使用到Dio上传功能,具体代码 上传七牛需要获取上传七牛的token 调用doUploadFile实现上传 简单实现上传队列,这里上传采用一个接着一个上传, 代码如下 flutter开发实战-文件上传及上传

    2024年02月10日
    浏览(28)
  • Flutter学习2 - Dart

    Dart语言特点: Dart 2.0 开始便是强类型语言,而且是静态类型的(可以类比Java,C#等) 强类型语言的优点:所有类型的检查必须在编译的时候完成 前端开发的 js 语言是弱类型的语言 强类型的语言需要在定义的时候指定类型,如果不指定,编译器也可以在赋值的时候推断出变

    2024年02月21日
    浏览(33)
  • 【Flutter】Dio 强大的Dart/Flutter HTTP客户端

    Dio是一个强大的Dart/Flutter HTTP客户端,支持全局配置、拦截器、FormData、请求取消、文件上传/下载、超时等功能。 首先,

    2024年02月11日
    浏览(35)
  • Flutter Dart语言(05)异步

    该系列教程主要是为有一定语言基础 C/C++的程序员,快速学习一门新语言所采用的方法,属于在C/C++基础上扩展新语言的模式。 在Dart语言中,虽然没有像其他语言(如Java、C++、Python)中的传统多线程概念,但它采用了异步(asynchronous)编程模型来处理并发任务。Dart使用asy

    2024年02月14日
    浏览(29)
  • 无涯教程-Flutter - Dart简介

    Dart是一种开源通用编程语言,它最初是由Google开发的, Dart是一种具有C样式语法的面向对象的语言,它支持诸如接口,类之类的编程概念,与其他编程语言不同,Dart不支持数组, Dart集合可用于复制数据结构,例如数组,泛型和可选类型。 以下代码显示了一个简单的Dart程序

    2024年02月10日
    浏览(40)
  • 【Flutter】Dart/Flutter SDK如何降低版本、回退到指定版本

    因为dart3.0以后不再支持 no-sound-null-safety;但是有些项目不得以切换到dart3.0以前继续使用运行项目 方法1: 通过 命令,将flutter降级为当前通道的上一个活动版本; 如果没有存在老版本则会提示 flutter downgrade There is no previously recorded version for channel “stable”. 这样的话则可以通

    2024年02月16日
    浏览(27)
  • flutter的引擎,Dart语言概括

    Dart是谷歌开发的, 类型安全的 , 面向对象 的编程语言,被应用于 Web、服务器、移动应用和物联网 等领域。 dart是谷歌在2011年推出的编程语言。谷歌希望使用dart来取代JavaScript。谷歌是一个颠覆式创新公司,谷歌退出golang是为了取代java,c++。谷歌退出flutter就是为了取代R

    2023年04月22日
    浏览(35)
  • Flutter Dart语言(04)库操作

    该系列教程主要是为有一定语言基础 C/C++的程序员,快速学习一门新语言所采用的方法,属于在C/C++基础上扩展新语言的模式。 引入代码如下所示: 一般从官方网站:Page 1 | Top packages中 搜索需要的第三方库,打开项目中的配置文件,名为:pubspec.yaml,找到dependencies选项,这

    2024年02月14日
    浏览(30)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包