Flutter Web从url下载文件,而不是打开它

jyztefdp  于 2023-01-09  发布在  Flutter
关注(0)|答案(3)|浏览(254)

有没有办法直接在用户的设备上下载.pdf这样的文件,而不是在浏览器中打开此pdf?此代码适用于下载不支持浏览器的文件,但它可以在浏览器中打开pdf,mp3等文件。

final anchor = AnchorElement(
    href: pickedFile)
  ..setAttribute("download", fileName)
    ..click();
hc8w905p

hc8w905p1#

如果有人还在寻找解决办法。以下是我所做的。
如果锚标签具有download属性,则将直接下载文件。
注意:只有同源请求才支持下载属性
因此,不是将外部URL链接分配给锚元素,而是从PDF数据创建Blob对象,并从中创建对象URL。

var url = Url.createObjectUrlFromBlob(Blob([data]));
      AnchorElement(href: url)
        ..setAttribute('download', '<downloaded_file_name.pdf>')
        ..click();

我正在使用Firebase来存储文件,所以这里是完整的代码。

FirebaseStorage.instance.ref(resumeFileName).getData().then(
    (data) {
      var url = Url.createObjectUrlFromBlob(Blob([data]));
      AnchorElement(href: url)
        ..setAttribute('download', '<downloaded_file_name.pdf>')
        ..click();
    }
  );
mznpcxlj

mznpcxlj2#

按照以下步骤操作,浏览器可以自动下载文件并保存到下载目录中。

  • 在此方法中,使用httpuniversal_html封装。
  • 最重要的是管理多平台模式,并使用此代码,最好创建3个独立的dart文件。

1.交换机本地web.dart

  1. web.dart
  2. native.dart
/// switch_native_web.dart 
import 'native.dart' if (dart.library.html) 'web.dart' as switch_value;

class SwitchNativeWeb {
   static void downloadFile({required String url,
   required String fileName ,required String dataType}){
           switch_value.downloadFile(dataType: dataType,fileName: fileName,url: url);}
 }

...

/// web.dart
    import 'dart:convert';
    import 'package:http/http.dart' as http;
    import 'package:universal_html/html.dart' as universal_html;
    

Future<void> downloadFile(
    {required String url,
    required String fileName,
    required String dataType}) async {
  try {
    // first we make a request to the url like you did
    // in the android and ios version
    final http.Response r = await http.get(
      Uri.parse(url),
    );

    // we get the bytes from the body
    final data = r.bodyBytes;
    // and encode them to base64
    final base64data = base64Encode(data);

    // then we create and AnchorElement with the html package
    final a =
        universal_html.AnchorElement(href: '$dataType;base64,$base64data');

    // set the name of the file we want the image to get
    // downloaded to
    a.download = fileName;

    // and we click the AnchorElement which downloads the image
    a.click();
    // finally we remove the AnchorElement
    a.remove();
  } catch (e) {
    print(e);
  }
}

...

/// native.dart
  Future<void> downloadFile({required String url, required String fileName,
     required String dataType}) async {}

并使用以下示例代码在需要时调用downloadFile方法:

...
          GestureDetector(
            onTap: () => SwitchNativeWeb.downloadFile(
                url: "https://... your url ..../download.jpg",
                fileName: "download.jpg",
                dataType: "data:image/jpeg"),
            child: Text('download')
    )
...

我只写了与web下载相关的代码(根据问题),你可以在native .dart文件中写与ios和android下载相关的代码。

jaql4c8m

jaql4c8m3#

使用Dio库。

dependencies:
  dio: ^3.0.10

下载文件

response = await dio.download("https://www.google.com/", "./xx.html");

这个video会帮助你。

相关问题