Я хочу отправить изображения через websocket, но терплю неудачу, плюс я до этого c js не работал (
Надеюсь кто-нибудь сталкивался с такой задачей .
Разметка html
<div class="frame" id="scene">
<div class="cardView">
<input type="file" id="fileElem" multiple="true" accept="image/*" style="display:none" onchange="handleFiles(this.files)" >
<button id="fileSelect">Download Images</button>
</div>
<div id="imgContainer">
<ul id="img-list"></ul>
</div>
<div>
<button id="btnUploadImage">Отправить на сервер</button>
</div>
</div>
Это слушатели, сперва создаются изображения
var fileSelect = document.getElementById("fileSelect"),
fileElem = document.getElementById("fileElem");
fileSelect.addEventListener("click", function (e) {
if (fileElem) {
fileElem.click();
}
}, false);
//Создаем элементы
function handleFiles(files) {
var list = document.getElementById("img-list")
for (var i = 0; i < files.length; i++) {
var file = files[i];
var li = document.createElement("li");
list.appendChild(li);
var img = document.createElement("img");
img.src = window.URL.createObjectURL(file);
img.height = 60;
img.onload = function () {
window.URL.revokeObjectURL(this.src);
}
li.appendChild(img);
// Это метод должен был сработать при нажатие на кнопку "отправить на сервер"
uploadFile(files)
}
}
Потом я пробегаю циклом по созданным данным и пытаюсь передать их через сокет
Прикол в том что я не знаю как передать созданные объекты, поэтому передал все данные прямо в методе выше -handleFiles, ожидая ошибку, но консоль молчит )
Собственно сам метод отправки созданных изображений
//Пробежимся по элементам
btnUploadImage.addEventListener("click" ,uploadFile)
function uploadFile(files) {
for (var i = 0; i < files.length; i++) {
file = files[i]
var reader = new FileReader()
var rawData = new ArrayBuffer();
reader.onloadend = function (e) {
rawData = e.target.result;
var images = rawData
var data = { query_type:"loadFrame", data : {images: images} }
console.log(data)
socket.send(JSON.stringify(data))
}
reader.readAsArrayBuffer(file);
}
}
Данных на сервере нет и консоль молчит поэтому я даже не знаю, где у меня ошибка(не считая, что uploadFile вызывается из handleFile) . В общем нуждаюсь в вашей помощи .Спасибо!
з.ы. По идее я бы хотел бы загружать средствами сервера, например как request.FormFile().