Опция загрузки Flutter WEB


12

Я делаю флаттер веб-приложение, которое должно генерировать файл из пользовательских данных. И есть возможность скачать выходной файл.

Но я не могу найти какие-либо опции / пакеты, которые работают для веб-флаттера :(

Может кто-нибудь помочь мне?


Какие данные вы хотите загрузить в формате CSV, Pdf и т. Д.?
Дениз Баяр

Другая проблема, с которой я столкнулся, - это использование единой базы кода для приложений Flutter и Web. Попытка скомпилировать его на Flutter не нравится dart:htmlплагинам, которые есть в ответах ниже.
Сурагч

Является ли это полезно для вашего дела @Suragch?
Тьяго Мартинс Перес 李大仁

1
@TiagoMartinsPeres, хотя я не использую Firebase, исходный код в ссылке на ответ был интересным. Спасибо. Я надеялся на более простое решение, но Flutter Web все еще находится в бета-версии. Надеемся, что в будущем появятся более простые кроссплатформенные решения.
Сурагч

Ответы:


3

Хороший способ - открыть размещенный файл в новой вкладке, используя

import 'dart:html' as html;

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

Хорошо подходит для моего случая использования.


Это работает для загрузки файла APK. Он не работает для загрузки аудиофайла, потому что аудиофайл начинает воспроизводиться автоматически.
Сурагч

Да, я также пытаюсь загрузить файл .json, и он тоже открывается вкладкой chrome. Попытка выяснить, есть ли какой-нибудь способ использовать тег "download" в 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();
}

1
Поскольку этот ответ пришел поздно в период вознаграждения, у меня нет времени попробовать его до истечения срока действия вознаграждения. Тем не менее, я предполагаю, что это работает (но можете ли вы подтвердить, что он будет загружать аудиофайл, не просто воспроизводя его автоматически?). Я выбираю этот ответ, потому что это легко понять.
Сурагч

Это специально для флаттера. Есть ли альтернатива для мобильного приложения?
Рази Каллай

В Android вы можете скачать файл с URL-адреса и сохранить его в памяти телефона с помощью библиотеки ввода-вывода.
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();
}

Ницца. Я ничего не знаю о шаблонах, используемых в нативном javascript, поэтому я подробнее расскажу об этом.
Сурагч


Вау, это спасло меня БОЛЬШОЕ ВРЕМЯ! Огромное спасибо. Этот код может мгновенно загрузить PDF-файл, созданный мной во Flutter.
Нипунасудха

0

Ответ на щедрость:

в случае аудиофайла он просто начинает воспроизводиться, а не загружается

Я сделал то же самое с видео, но я уверен, что оно будет работать и со звуком. Я предполагаю, что ваш сгенерированный звук является массивом или блобом

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

Что делать, если аудиофайл - это URL http://www.example.com/my_audio.mp3?
Сурагч

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');
}
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.