কীভাবে ফ্লটার ওয়েব অ্যাপ্লিকেশনটিতে টেক্সট ফাইলটি সংরক্ষণ এবং ডাউনলোড করা যায়

Question

আমি ফ্লাটারে নতুন এবং একটি ফ্লটার ওয়েব অ্যাপ্লিকেশনটিতে কাজ করছি, আমার প্রয়োজনীয়তা একটি পাঠ্য ফাইল তৈরি এবং ডাউনলোড করা। নীচের মত।

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

কেউ আমাকে এটি অর্জনে সহায়তা করতে পারে

Answer 1

এই পদ্ধতিটি একটি HTMLনথির সাথে ম্যানিপুলেশনগুলির উপর ভিত্তি করে । কিছু অতিরিক্ত প্যাকেজ আমদানি করা উচিত:

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

টুকিটাকি সংকেতলিপি:

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

এখানে হয় DartPadডেমো।

Comments

ধন্যবাদ! এটি কিছুটা হ্যাকি মনে হয় তবে এটি কাজ করে। দুর্ভাগ্যক্রমে, আমি ক্রোমে "হিসাবে সংরক্ষণ করুন" ডায়ালগটি পাই না, এটি কেবল একটি ফাইল ডাউনলোড শুরু করে। এবং আমার কাছে "ডাউনলোডের আগে প্রতিটি ফাইল কোথায় সংরক্ষণ করবেন তা জিজ্ঞাসা করুন" সেটিংস চালু আছে।

— ওলেকসেই শ্লিয়ামা

@ ওলেকসিআইশ্লিয়ামা যদি আপনি ফাইলসভার.জেএস লাইব্রেরিতে সন্ধান করেন তবে এটি স্প্যাটজ যা করেছে ঠিক তেমন কাজ করছে :)। এখানে চেক । এছাড়াও সেভ হিসাবে ডায়লগটি ক্রোমে আমার জন্য উপস্থিত হয়। একটি সংস্করণ সমস্যা হতে পারে ..?

— অভিলাষ চন্দ্রন

Answer 2

এটি করতে আর একটি উপায় পেয়ে গেলেন, জনপ্রিয় জেএস লাইব্রেরির মাধ্যমে ফাইলসেভার নামে পরিচিত

প্রথমে আপনার ProjectFolder/web/index.htmlফাইলটি লাইব্রেরি অন্তর্ভুক্ত করতে আপডেট করুন এবং এর webSaveAsমতো ফাংশনটি সংজ্ঞায়িত করুন :

...

<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>

...

তারপরে আপনি ডার্ট কোড থেকে এই জাতীয় ফাংশনটি কল করতে পারেন:

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

...

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

Answer 3

এই সমাধানটি ফাইলসেভার.জেএস লাইব্রেরি ব্যবহার করে এবং এটি "সেভএএস" ডায়ালগটি খুলতে হবে।

আমি আশা করি এটি লক্ষ্য হিসাবে কাজ করে:

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