У меня есть изображение с URL-адресом base64 как src. Я хотел бы отправить это изображение на сервер, используя входной файл (с формой). Итак, мне нужно преобразовать тег img во входной файл.
Я использую плагин Croppie для обрезки изображения. Затем результат записывается в тег img.
Я попытался преобразовать тег img в файл. Но тогда я не знаю, как преобразовать файл во входной файл.
<div>
<label for = "img">Image</label><input type = "file" name = "img" id = "img" value = ""/>
</div>
<div>
<img id = "outImg" />
<input type = "file" name = "imgtbn" id = "imgtbn" value = ""/>
</div>
document.getElementById('img').onchange = function (evt) {
var output = document.getElementById('outImg');
output.src = URL.createObjectURL(evt.target.files[0]);
if (this.c!=undefined)
{
this.c.destroy();
}
var el = document.getElementById('outImg');
this.c = new Croppie(el, {
viewport: { width: 300, height: 300 },
boundary: { width: 900, height: 300 },
showZoomer: false,
enableOrientation: true,
update: function (data) {
this.result('base64').then(function(dataImg) {
$('#imgCropped').attr('src', dataImg);
img = document.getElementById('imgCropped');
fetch(img.src)
.then(res => res.blob())
.then(blob => {
file = new File([blob], 'file', blob)
document.getElementById('imgtbn').file = file;
});
})
}
});
};
Я хотел бы, чтобы входной файл был заполнен обрезанным изображением.
Спасибо за уделенное время.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вы не можете. Вы не только не можете использовать base64 в теге файла, но только в реальном файле, но вы даже не можете вообще установить значение ввода файла в Javascript. Это вопрос безопасности.
Но почему вы хотите? Если у вас уже есть файл, закодированный как base64, любой текстовый ввод подходит для его отправки на сервер. Я бы, вероятно, использовал <input type="hidden">, потому что нет смысла отображать код. И если вы хотите предварительный просмотр, используйте тег img.
Как сказал Amunium, входные файлы доступны только для чтения.
Сохранение изображения base64 на скрытом входе — лучший способ сделать это.
Можно очистить входные значения файла программно, но они все равно будут отправлены; хоть и пустой.
Существует простое объяснение того, как это сделать простым способом..