cari

Rumah  >  Soal Jawab  >  teks badan

javascript - Adakah mungkin untuk menyimpan elemen <img> sebagai menggunakan js tanpa menghantar permintaan untuk muat turun?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>test</title>
</head>
<body>

<img 
   src='https://sfault-avatar.b0.upaiyun.com/498/442/498442326-5810374d88a21_big64' 
   id='img' >

<button onclick="download()">下载</button>

<script>
/**
 * 是否存在某种途径，可以实现点击后，直接在浏览器端把图片保存到用户的电脑上？
 * ps： 我用尝试了一种方法，把img转成canvas，然后使用FileSaver.js能做到，
 * 但是，这个保存出来的图片，体积很大，存在性能问题。
 * 所以，我在想，能否直接把<img>元素的图片直接保存到用户的电脑上？
 * 一般的做法，都是点击按钮，发送一个请求到服务器下载到用户电脑上，
 * 我知道我这想法有点另类，但希望能讨论一下
 **/
function download(){
  var img = document.getElementById('img');
  //......

}
</script>
</body>
</html>
漂亮男人漂亮男人2823 hari yang lalu588

membalas semua(2)saya akan balas

  • 我想大声告诉你

    我想大声告诉你2017-05-19 10:43:13

    Saya juga terfikir tentang kanvas pada mulanya, tetapi saya melihat bahawa penanya telah mencubanya. Saya belum memikirkan apa-apa lagi.

    Tetapi untuk perkara yang anda katakan tentang "saiz fail terlalu besar", jika anda menukar imej kepada base64 menggunakan kanvas, ini mungkin kerana anda menetapkan format imej kepada format png, seperti: 

    canvas.toDataURL('image/png')

    Jika ini berlaku, maka anda boleh menukarnya kepada format jpeg, dan anda boleh mengawal kualiti penukaran , supaya ia menjadi lebih kecil apabila disimpan. Contohnya: 

    canvas.toDataURL('image/jpeg',0.5);

    Rasanya kalau macam ni memang takde masalah dari segi saiz.

    ps: Saya telah menggunakan atribut muat turun teg yang dinyatakan di atas, tetapi ia mungkin agak bermasalah untuk situasi subjek.

    1. Permintaan mungkin masih diperlukan. Jika atribut muat turun boleh membaca imej daripada cache dan menyimpannya, maka mungkin tidak perlu meminta imej cache (sebenarnya, saya belum tahu lagi sama ada ia mempunyai mekanisme untuk membaca imej cache, mungkin tidak sama sekali). Tetapi untuk gambar yang besar, walaupun ia dimuatkan dalam halaman web, memuat turun menggunakan atribut muat turun masih perlu dimuat turun dari pelayan. 

    <a href="https://files.yande.re/image/eb619bf8aff0bd440ec724211fce245c/yande.re%20389825%20dress%20elf%20erect_nipples%20makita_yoshiharu%20no_bra%20nopan%20open_shirt%20pointy_ears%20see_through%20skirt_lift.jpg" download="a.jpg">xxxxx</a>
<br>
<img src="https://files.yande.re/image/eb619bf8aff0bd440ec724211fce245c/yande.re%20389825%20dress%20elf%20erect_nipples%20makita_yoshiharu%20no_bra%20nopan%20open_shirt%20pointy_ears%20see_through%20skirt_lift.jpg">

    2. Atribut muat turun berada dalam firefox, dan fail dalam href perlu mempunyai asal yang sama dengan nama domain halaman web semasa, jika tidak, ia tidak akan dimuat turun. Walau bagaimanapun, jika dilihat dari situasi subjek, ia harus dari sumber yang sama, jadi masalah ini tidak wujud.

    3.

    balas
    0
  • phpcn_u1582

    phpcn_u15822017-05-19 10:43:13

    Atribut muat turun teg boleh disokong, tetapi terdapat isu keserasian secara umumnya perlu diselesaikan oleh pelayan.

    balas
    0
  • Batalbalas