Изначально я использовал FileReader для преобразования загрузки изображений в base64 на стороне клиента, а затем encrypt .Присоединил бы этот результат к полю формы и затем отправил бы, но это занимает слишком много времени, поэтому я ищу альтернативу.
Я пытаюсь использовать JSZip для первогосжать и затем зашифровать, а затем отправить, извлечь, расшифровать и показать изображение, но я застрял на том, как это сделать.Моя попытка сжатия выглядит следующим образом.
$(document).on("change", "#chatImage", function() {
var rid = $(this).closest(".chat").data("id");
var tempSrc = $(this).val();
/* Make a zip file here */
var fi = $(this);
var fileInput = fi;
var files = [];
// get all selected file
$.each(fileInput.files, function(i, file) {
files.push(file);
});
//create a zip object
var zip = new JSZip();
//add all files to zip
function addFileToZip(n) {
if(n >= files.length) {
//here generate file to zip on client side
zip.generateAsync({type:"blob", compression:"default"}).then(function(content){
//generated zip content to file type
var files = new File([content], "default.zip");
console.log(files);
var eImgArray = {};
$.ajax({
url : ajax_object.ajax_url,
type : 'post',
data : {
action: 'get_room_member_keys',
rid : rid,
},
beforeSend: function() {},
success: function(html) {
var pubKeys = $.parseJSON(html);
$.each( pubKeys, function( key, value ) {
var imgEncrypt = cryptico.encrypt(files, value);
var imgSrc = imgEncrypt.cipher;
eImgArray[key] = imgSrc;
});
var strImgArray = JSON.stringify(eImgArray);
},
});
});
return;
}
var file = files[n];
var arrayBuffer;
var fileReader = new FileReader();
fileReader.onload = function() {
arrayBuffer = this.result;
zip.file(file.name, arrayBuffer);
addFileToZip(n + 1);
}
fileReader.readAsArrayBuffer(file);
}
addFileToZip(0);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.2.0/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id="jaj3dm" class="chat" />
<input id="chatImage" type="file" multiple="multiple" />
Это показывает зашифрованную строку в консоли и результат сжатия, но когда я расшифровываю и записываю результат в консоль, я ничего не получаю.Как правильно это сделать или лучше?