Bagaimanakah Saya Boleh Menyesuaikan Nama Fail Blob Apabila Memuat Turun Terus dalam JavaScript?

Menyesuaikan Nama Fail Blob untuk Muat Turun Terus dalam JavaScript

Pengenalan

Apabila menggunakan window.location untuk memaksa memuat turun fail gumpalan dalam JavaScript, nama fail yang dimuat turun dijana secara automatik. Untuk menyesuaikan nama fail ini, langkah tambahan diperlukan.

Penyelesaian dengan Trik FileSaver.js

Satu penyelesaian melibatkan penggunaan teknik yang serupa dengan yang digunakan oleh FileSaver.js:

1. Buat tag.
2. Tetapkan URL gumpalan kepada atribut href.
3. Tetapkan nama fail yang diingini menggunakan atribut muat turun.
4. Mulakan muat turun dengan mengklik pada tag.

Contoh Ringkas

function saveData(data, fileName) {
  var json = JSON.stringify(data),
      blob = new Blob([json], {type: "octet/stream"}),
      url = window.URL.createObjectURL(blob);
  var a = document.createElement("a");
  document.body.appendChild(a);
  a.style = "display: none";
  a.href = url;
  a.download = fileName;
  a.click();
  window.URL.revokeObjectURL(url);
}

var data = { x: 42, s: "hello, world", d: new Date() },
    fileName = "my-download.json";

saveData(data, fileName);

Penggunaan FileSaver.js

Sedangkan kaedah di atas boleh berfungsi, adalah disyorkan untuk menggunakan pustaka FileSaver.js yang lebih mantap untuk menyimpan fail JavaScript:

import { saveAs } from 'file-saver';

var json = JSON.stringify(data),
    filename = "my-download.json";

var blob = new Blob([json], {type: "octet/stream"});
saveAs(blob, filename);

Pertimbangan

• Pelayar lama mungkin tidak menyokong atribut muat turun, kerana ia adalah ciri HTML5.
• Tertentu format fail mungkin dianggap tidak selamat dan menyekat muat turun. Menyimpan fail JSON dengan sambungan .txt boleh mengurangkan isu ini.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyesuaikan Nama Fail Blob Apabila Memuat Turun Terus dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!