Muat turun butang imej dari pelayan pihak ketiga

Question

Dalam mana-mana pelayar, jika anda melihat imej, anda boleh klik kanan padanya dan klik "Simpan Sebagai" untuk memuat turunnya.

Saya cuba membuat butang untuk memuat turun imej

Butang muat turun hendaklah memuat turun imej di atas, kod bar.

Saya menggunakan react, tidak pasti sama ada ini berkaitan dengan jawapan.

Saya membaca bahawa anda boleh menggunakan atribut <a/> 标签与 download bersama-sama, namun, saya menggunakan Firefox dan ia mengubah hala saya ke halaman yang mengehos imej kod bar dan tidak membuka tetingkap muat turun:

Kod ini sangat mudah dan kelihatan seperti ini:

<a href='https://barcode.tec-it.com/barcode.ashx?data=${product.barcode}&code=&multiplebarcodes=true&backcolor=%23ffffff&quietzone=10&quietunit=Px&size=Small' download>click me</a>

Dari dokumentasi MDN:

Muat turun hanya berfungsi dengan URL asal yang sama, atau gumpalan: dan data: rancangan.

Saya ingin melaksanakan ini, bagaimana saya melakukannya? Saya tidak memiliki pelayan yang mengehos imej itu.

Bolehkah kita melakukan ini pada tahun 2023?

Isu lain bercampur antara imej tempatan dan imej yang dihoskan pada pelayan lain. Jadi saya fikir saya akan mencipta benang ini untuk anda yang hanya berminat dengan imej pada pelayan pihak ketiga. - Jadi kita semua adalah bahagian hadapan di sini, tidak ada perkara yang berkaitan dengan bahagian belakang.

Answer 1

Saya rasa soalan anda merujuk kepada soalan lama ini.

Anda perlu menghantar pengepala Content-Disposition pada pelayan untuk menetapkan fail sebagai lampiran supaya penyemak imbas tidak cuba mengendalikan fail secara dalaman.

Sila lihat: pautan imej href klik untuk muat turun