我正在裁剪图片。我正在上传要裁剪的图像。我也想上传原始图像。我该怎么办?
正是我想要的;
我正在发送要用ajax裁剪的图片。我想用ajax发送原始图片。
如果您能帮助我,我会很高兴。谢谢。
如果您修改代码,我将不胜感激
我的代码:
window.addEventListener('DOMContentLoaded', function () {
var avatar = document.getElementById('resimFirma');
var image = document.getElementById('imageResim');
var input = document.getElementById('inputResim');
var $modal = $('#modalResim');
var cropper;
input.addEventListener('change', function (e) {
var files = e.target.files;
var done = function (url) {
input.value = '';
image.src = url;
$modal.modal('show');
};
var reader;
var file;
var url;
if (files && files.length > 0) {
file = files[0];
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function (e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
});
$modal.on('shown.bs.modal', function () {
cropper = new Cropper(image, {
aspectRatio: 450/600,
});
}).on('hidden.bs.modal', function () {
cropper = null;
});
document.getElementById('cropResim').addEventListener('click', function () {
var initialAvatarURL;
var canvas;
$modal.modal('hide');
if (cropper) {
canvas = cropper.getCroppedCanvas({
width: 450,
height: 600,
});
initialAvatarURL = avatar.src;
avatar.src = canvas.toDataURL();
canvas.toBlob(function (blob) {
var formData = new FormData();
formData.append('resimFirma', blob, 'resimFirma.jpg');
$.ajax('firmaResimYukle.php', {
method: 'POST',
data: formData,
processData: false,
contentType: false,
complete: function(data) {
alert("Resim başarıyla yüklendi.");
setTimeout(function(){
window.location.reload(1);
}, 1000);
},
});
});
}
});
});