Flutter WEB Download-Option

Ich mache eine flatternde Web-App, die eine Datei aus Benutzerdaten generieren soll. Und haben Sie die Möglichkeit, die Ausgabedatei herunterzuladen.

Aber ich kann keine Optionen / Pakete finden, die für Flatter Web funktionieren :(

Kann mir bitte jemand helfen?

Eine gute Problemumgehung besteht darin, die gehostete Datei in einem neuen Tab mit zu öffnen

import 'dart:html' as html;

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

Passt gut zu meinem Anwendungsfall.

Einfacher Code zum Umleiten zum Herunterladen der URL

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

Eine Möglichkeit, den Download auszulösen, besteht darin, ein allgemeines Muster anzupassen, das in "nativem" Javascript verwendet wird, ein Ankerelement mit dem downloadAttribut zu erstellen und einen Klick auszulösen.

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();
}

Antwort auf Kopfgeld:

Bei einer Audiodatei wird sie nur abgespielt, anstatt sie herunterzuladen

Ich habe dasselbe mit Video gemacht, aber ich bin sicher, dass es auch mit Audio funktionieren wird. Ich gehe davon aus, dass Ihr generiertes Audio ein Array oder ein Blob ist

    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);
    }

Sie können das Paket url_launcher mit url_launcher_web verwenden

dann können Sie tun:

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

EDIT: Sie benötigen kein Plugin, wenn Sie dies tun

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 und Verwendung:

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

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