Как скопировать в буфер изображение, а потом вставить его в редактор с помощью JavaScript?

Question

[HellishCode]

Добрый день
Подскажите пожалуйста, как можно скопировать (контрол + с) изображение, а потом вставить его(контрол + в) в текстовый редактор или тексэриа?

Comments

[NeffiseX]

Либо node js либо deno

Answer 1

[Евгений Ежов]

Можно сделать с помощью div у которого установлен атрибут contenteditable.

Answer 2

[Vladislav]

Когда ты копируешь картинку, в буфер она попадает в формате base64:

document.onpaste = function(event){
  var items = (event.clipboardData || event.originalEvent.clipboardData).items;
  console.log(JSON.stringify(items)); // will give you the mime types
  for (index in items) {
    var item = items[index];
    if (item.kind === 'file') {
      var blob = item.getAsFile();
      var reader = new FileReader();
      reader.onload = function(event){
        console.log(event.target.result)}; // data url!
      reader.readAsDataURL(blob);
    }
  }
}

Вот еще рабочий вариант: jsfiddle.net/bt7BU/225

Comments

[HellishCode]

Не работает.
Я пытаюсь скопировать(или перетащить) из Ауьлука подпись, в которой находится картинка. С текстом все понятно, а вот изображение, которое добавлено в подпись не вставляется в ваше текстовое поле.

[Vladislav]

HellishCode, а вы что хотели готовый рабочий вариант ?
скидывайте тз и деньги я сделаю вам рабочий вариант, вам останется только вставить к себе код )

[HellishCode]

Владислав, а смысл кидать код, который не работает? в чем тогда ваш совет?

[Vladislav]

HellishCode, он работает. допиливайте его. В нём есть все что вам для реализации вашей задачи