Flutter opzione di download WEB


12

Sto realizzando un'app Web flutter che dovrebbe generare un file dai dati dell'utente. E hai la possibilità di scaricare il file di output.

Ma non riesco a trovare alcuna opzione / pacchetto che funzioni per flutter web :(

Qualcuno può aiutarmi per favore?


Che tipo di dati vuoi scaricare CSV, Pdf ecc?
Deniz Bayar,

Un altro problema che sto riscontrando è l'utilizzo di un'unica base di codice per l'app Flutter e Web. Cercando di compilarlo su Flutter non piacciono i dart:htmlplugin che hanno le risposte qui sotto.
Suragch

È questo utile al vostro caso @Suragch?
Tiago Martins Peres

1
@TiagoMartinsPeres, anche se non sto usando Firebase, il codice sorgente nel link della risposta era interessante. Grazie. Speravo in una soluzione più semplice, ma Flutter Web è ancora in beta. Speriamo che in futuro verranno fornite soluzioni multipiattaforma.
Suragch

Risposte:


3

Una buona soluzione è aprire il file ospitato in una nuova scheda usando

import 'dart:html' as html;

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

Si adatta bene al mio caso d'uso.


Questo funziona per il download di un file APK. Non funziona per il download di un file audio perché il file audio inizia a essere riprodotto automaticamente.
Suragch

Sì, sto anche provando a scaricare un file .json e anch'esso viene aperto dalla scheda Chrome. Prova a vedere se esiste un modo per usare il tag "download" in html5.
Eradicatore

2

Codice semplice per reindirizzare per scaricare l'URL

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

1
Dal momento che questa risposta è arrivata in ritardo nel periodo della taglia, non ho tempo di provarla prima della scadenza della taglia. Tuttavia, suppongo che funzioni (ma puoi confermare che scarica un file audio senza riprodurlo automaticamente?). Sto scegliendo questa risposta perché è facile da capire.
Suragch

Questo è specifico per il flutter web. Esiste un'alternativa per l'app per dispositivi mobili?
Razi Kallayi,

In Android è possibile scaricare il file dall'URL e salvarlo nella memoria del telefono utilizzando la libreria IO.
vishwajit76,

1

Un modo per attivare il download è quello di adattare un modello comune utilizzato nel javascript "nativo", creare un elemento di ancoraggio con l' downloadattributo e attivare un clic.

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

Bello. Non so nulla sugli schemi utilizzati nel javascript nativo, quindi approfondirò questo aspetto.
Suragch


Wow, questo mi ha salvato BIG TIME! Grazie mille. Questo codice può scaricare istantaneamente un file pdf che ho generato in Flutter.
nipunasudha,

0

Risposta alla taglia:

nel caso di un file audio, inizia la riproduzione anziché scaricarlo

Ho fatto la stessa cosa con il video, ma sono sicuro che funzionerà anche con l'audio. Presumo che l'audio generato sia un array o un 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);
    }

Cosa succede se il file audio è url è http://www.example.com/my_audio.mp3?
Suragch

0

puoi usare il pacchetto url_launcher con url_launcher_web

allora puoi fare:

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

EDIT: non è necessario un plugin se si esegue questa operazione

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

importare e utilizzare:

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

void main () {
  download('I am a test file'.codeUnits, // takes bytes
      downloadName: 'test.txt');
}
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.