Flutter WEB下载选项

12

我正在制作应从用户数据生成文件的Flutter Web应用程序。并可以选择下载输出文件。

但是我找不到适用于Flutter Web的任何选项/软件包:(

有人可以帮我吗？

— 普拉蒂克
source

您要下载CSV，Pdf等什么样的数据？

— Deniz Bayar

我遇到的另一个问题是为Flutter和Web应用程序使用单个代码库。尝试在Flutter上编译它不喜欢dart:html以下答案提供的插件。

— Suragch

是这有助于你的情况@Suragch？

— Tiago Martins Peres李大仁

1

@TiagoMartinsPeres，尽管我没有使用Firebase，但答案链接中的源代码很有趣。谢谢。我希望有一个更简单的解决方案，但Flutter Web仍处于测试阶段。希望将来会提供更简单的跨平台解决方案。

— Suragch

3

一个好的解决方法是使用以下命令在新选项卡中打开托管文件

import 'dart:html' as html;

openInANewTab(url){
  html.window.open(url, 'PlaceholderName');
}

非常适合我的用例。

— 肖什瓦特·阿迪亚（Shashwat Aditya）
source

这适用于下载APK文件。下载音频文件不起作用，因为音频文件会自动开始播放。

— Suragch

是的，我也正在尝试下载.json文件，但chrome标签也将其打开。尝试查看是否有某种方法可以在html5中使用“下载”标签。

— Eradicatore

2

重定向到下载URL的简单代码

import 'dart:html' as html;
void downloadFile(String url){
   html.AnchorElement anchorElement =  new html.AnchorElement(href: url);
   anchorElement.download = url;
   anchorElement.click();
}

— Vishwajit76
source

1

由于这个答案是在赏金期间来得很晚的，因此我没有时间在赏金到期之前尝试一下。但是，我假设它可以工作（但是您是否可以确认它会下载音频文件而不是自动播放？）。我选择此答案是因为它很容易理解。

— Suragch

这是专门用于颤动卷筒纸。移动应用程序还有其他选择吗？

— 拉齐·卡拉莱

在Android中，您可以从网址下载文件，然后使用IO库将其保存到手机存储中。

— vishwajit76

1

触发下载的一种方法是调整“本机” javascript中使用的通用模式，使用该download属性创建锚元素，然后触发点击。

import 'dart:convert';
import 'dart:html';

main() {
  File file = // generated somewhere
  final rawData = file.readAsBytesSync();
  final content = base64Encode(rawData);
  final anchor = AnchorElement(
      href: "data:application/octet-stream;charset=utf-16le;base64,$content")
    ..setAttribute("download", "file.txt")
    ..click();
}

— 达加德纳
source

真好我对原生javascript中使用的模式一无所知，因此我将对此进行更多研究。

— Suragch

stackoverflow.com/a/3665147/3941291

— DaGardner

哇，这为我节省了很多时间！非常感谢。此代码可以立即下载我在Flutter中生成的pdf文件。

— nipunasudha

0

对赏金的回应：

对于音频文件，它只是开始播放而不是下载它

我已经对视频做过同样的事情，但是我敢肯定它也可以与音频一起工作。我想，您生成的音频是数组或Blob

    import 'dart:js' as JS;
    import 'dart:html' as HTML;

    const mimeType = 'audio/wav'; // TODO: Pick a right format

    void downloadFile(List chunks) async {
        final blob = HTML.Blob(chunks, mimeType);
        final objectUrl = await HTML.Url.createObjectUrlFromBlob(blob);
        final a = HTML.AnchorElement();
        a.href = item.url;
        a.download = "my_audio_file_${DateTime.now()}.wav";
        HTML.document.body.append(a);
        a.click();
        // Wait for click event to be processed and cleanup
        await Future.delayed(Duration(milliseconds: 100));
        a.remove();
        HTML.Url.revokeObjectUrl(item.videoObjectUrl);
    }

— 迪玛·罗斯托皮拉（Dima Rostopira）
source

如果音频文件是url http://www.example.com/my_audio.mp3怎么办？

— Suragch

0

您可以将url_launcher包与url_launcher_web一起使用

那么您可以执行以下操作：

launch("data:application/octet-stream;base64,${base64Encode(yourFileBytes)}")

编辑：如果您这样做，则不需要插件

download.dart：

import 'dart:convert';
// ignore: avoid_web_libraries_in_flutter
import 'dart:html';

void download(
  List<int> bytes, {
  String downloadName,
}) {
  // Encode our file in base64
  final _base64 = base64Encode(bytes);
  // Create the link with the file
  final anchor =
      AnchorElement(href: 'data:application/octet-stream;base64,$_base64')
        ..target = 'blank';
  // add the name
  if (downloadName != null) {
    anchor.download = downloadName;
  }
  // trigger download
  document.body.append(anchor);
  anchor.click();
  anchor.remove();
  return;
}

empty_download.dart：

void download(
  List<int> bytes, {
  String downloadName,
}) {
  print('I do nothing');
}

导入和使用：

import 'empty_download.dart'
if (dart.library.html) 'download.dart';

void main () {
  download('I am a test file'.codeUnits, // takes bytes
      downloadName: 'test.txt');
}

— Pinguinitorawr
source