javascript - Collez un élément de contenu avec des images et du texte, comment utiliser js pour obtenir une image et la télécharger sur le serveur?

Question

Je dois coller un élément de contenu avec du texte et des images, mais les images doivent être téléchargées séparément sur le serveur. Comment sélectionner les images à partir du contenu collé. .

Answer 1

Idée générale :

1. Écoutez l'événement onpaste

2. Obtenez les données du presse-papiers via le paramètre d'événement dans le rappel d'événementevent.clipboardData (non pris en charge par tous les navigateurs)

   // '/image/.test(event.clipboardData.types)' // 检查是否为图片
   
   // 获取图片二进制数据（似乎浏览器的实现都会有大小差异）
   Array.each(event.clipboardData.items, function(item){
   if (/image/.test(item.type)) {
   var blob = item.getAsFile();
   var URL = window.URL || window.webkitURL;
   var source = URL.createObjectURL(blob);
   console.log(source) 
   }
   });

3. Envoyez les données au serveur backend via Ajax. Une fois que le backend a stocké l'image, il renvoie une adresse accessible de l'image

.

4. Visitez cette adresse pour voir les photos