Bagaimanakah Saya Boleh Mencipta dan Memuat Turun Fail Teks Dalam Memori Sebelah Klien Tanpa Interaksi Pelayan?

Mencipta Fail Dalam Memori untuk Muat Turun Sebelah Klien tanpa Interaksi Pelayan

Mencipta fail teks pada sisi klien dan menggesa pengguna memuat turunnya tanpa penglibatan pelayan adalah keperluan biasa dalam pembangunan web. Walau bagaimanapun, kebimbangan keselamatan menghalang penulisan terus kepada mesin pengguna. Nasib baik, terdapat penyelesaian yang melibatkan mencipta fail dalam memori dan menggesa pengguna untuk menyimpannya.

Penciptaan dan Muat Turun Fail Sebelah Pelanggan

Untuk mencapai matlamat ini, kita boleh memanfaatkan keupayaan penyemak imbas yang serasi dengan HTML5. Coretan kod JavaScript berikut menunjukkan cara membuat fail teks dalam ingatan dan memulakan proses muat turun:

function download(filename, text) {
  var element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}

Pelaksanaan

Untuk menggunakan kod ini, anda boleh mencipta borang yang menerima nama fail dan kandungan teks. Selepas penyerahan, borang memanggil fungsi muat turun untuk mencipta fail dalam memori dan menggesa pengguna untuk memuat turunnya. Contoh borang dalam HTML:

<form onsubmit="download(this['name'].value, this['text'].value)">
  <input type="text" name="name" value="test.txt">
  <textarea name="text"></textarea>
  <input type="submit" value="Download">
</form>

Keserasian Pelayar

Penyelesaian di atas berfungsi dengan baik dalam penyemak imbas moden yang menyokong HTML5. Walau bagaimanapun, adalah penting untuk mempertimbangkan keserasian penyemak imbas jika anda perlu menyokong penyemak imbas yang lebih lama.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta dan Memuat Turun Fail Teks Dalam Memori Sebelah Klien Tanpa Interaksi Pelayan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!