Cách lưu và tải xuống tệp văn bản trong ứng dụng web Flutter

Tôi chưa quen với Flutter và làm việc trong một ứng dụng web rung, Yêu cầu của tôi là tạo và tải xuống một tệp văn bản. như dưới đây.

void getData() {
    List<int> bytes = utf8.encode('this is the text file');
    print(bytes); // Need to download this with txt file.
}

Ai có thể giúp tôi đạt được điều này

Phương pháp này dựa trên các thao tác với một HTMLtài liệu. Một số gói bổ sung nên được nhập:

import 'dart:convert';
import 'dart:html' as html; // or package:universal_html/prefer_universal/html.dart

Đoạn mã:

final text = 'this is the text file';

// prepare
final bytes = utf8.encode(text);
final blob = html.Blob([bytes]);
final url = html.Url.createObjectUrlFromBlob(blob);
final anchor = html.document.createElement('a') as html.AnchorElement
  ..href = url
  ..style.display = 'none'
  ..download = 'some_name.txt';
html.document.body.children.add(anchor);

// download
anchor.click();

// cleanup
html.document.body.children.remove(anchor);
html.Url.revokeObjectUrl(url);

Đây là DartPadbản demo.

Có một cách khác để làm điều đó, thông qua thư viện JS phổ biến có tên là FileSaver

Đầu tiên, cập nhật ProjectFolder/web/index.htmltệp của bạn để bao gồm thư viện và xác định webSaveAschức năng như vậy:

...

<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js"> 
</script>

<script>
function webSaveAs(blob, name) {
  saveAs(blob, name);
}
</script>

<script src="main.dart.js" type="application/javascript"></script>

...

Sau đó, bạn có thể gọi hàm này từ mã Dart như vậy:

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

...

js.context.callMethod("webSaveAs", [html.Blob([bytes], "test.txt"])

Giải pháp này sử dụng thư viện FileSaver.js và nó sẽ mở hộp thoại "saveAs".

Tôi hy vọng nó hoạt động như dự định:

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

...

final text = 'this is the text file';
final bytes = utf8.encode(text);

final script = html.document.createElement('script') as html.ScriptElement;
script.src = "http://cdn.jsdelivr.net/g/filesaver.js";

html.document.body.nodes.add(script);

// calls the "saveAs" method from the FileSaver.js libray
js.context.callMethod("saveAs", [
  html.Blob([bytes]),
  "testText.txt",            //File Name (optional) defaults to "download"
  "text/plain;charset=utf-8" //File Type (optional)
]);

 // cleanup
 html.document.body.nodes.remove(script);