Bagaimana untuk Menetapkan Nama Fail Tersuai untuk Muat Turun Blob dalam JavaScript?

Menetapkan Nama Fail Blob Tersuai dalam JavaScript

Apabila bekerja dengan gumpalan dalam JavaScript, anda mungkin menghadapi situasi di mana anda perlu menentukan tersuai nama fail dan bukannya nama fail lalai yang dijana secara rawak. Ini amat berguna apabila anda ingin memberikan nama fail yang bermakna untuk muat turun atau eksport data.

Masalah: Menetapkan Nama Fail Blob Tersuai

Coretan kod berikut mencipta blob dan cuba memuat turunnya melalui window.location, tetapi fail yang dimuat turun mempunyai nama rawak seperti "bfefe410-8d9c-4883-86c5-d76c50a24a1d":

function newFile(data) {
    var json = JSON.stringify(data);
    var blob = new Blob([json], {type: "octet/stream"});
    var url = window.URL.createObjectURL(blob);
    window.location.assign(url);
}

Penyelesaian: Menggunakan A Tag Trick

Satu-satunya kaedah yang diketahui untuk menetapkan nama fail tersuai kepada gumpalan dalam JavaScript melibatkan helah menggunakan tag:

1. Buat tag.
2. Tetapkan atribut hrefnya kepada URL gumpalan.
3. Tetapkan atribut muat turunnya kepada nama fail yang diingini.
4. Klik pada tag secara pemrograman.

Kod Contoh:

Contoh berikut menunjukkan cara menggunakan helah ini untuk menyimpan objek JSON pada fail dengan nama "my-download.json":

var saveData = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (data, fileName) {
        var json = JSON.stringify(data),
            blob = new Blob([json], {type: "octet/stream"}),
            url = window.URL.createObjectURL(blob);
        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);

Nota:

• Pelayar lama mungkin tidak menyokong atribut muat turun.
• Tertentu format fail mungkin tidak disokong oleh penyemak imbas dan boleh mengakibatkan kegagalan muat turun. Contohnya, menyimpan fail JSON dengan sambungan .txt telah diperhatikan berfungsi.

Atas ialah kandungan terperinci Bagaimana untuk Menetapkan Nama Fail Tersuai untuk Muat Turun Blob dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!