Right use of the toBlob function

This commit is contained in:
Mauro Mugnaini 2021-02-05 20:08:25 +01:00
parent 2279169018
commit aa07c719d3
1 changed files with 18 additions and 18 deletions

View File

@ -135,14 +135,13 @@
ctx = canvas.getContext("2d"); ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height); ctx.drawImage(img, 0, 0, width, height);
var imageBlob = canvas.toBlob("image/png"); canvas.toBlob(function(blob) {
var form = document.getElementById('theForm') var form = document.getElementById('theForm')
var formData = new FormData(form) var formData = new FormData(form)
// Deleting the big image from the form data to prevent send // Deleting the big image from the form data to prevent send
formData.delete('imageSelector') formData.delete('imageSelector')
// Adding new blob with new image with right size // Adding new blob with new image with right size
formData.append("image", imageBlob); formData.append("image", blob);
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() { xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) { if (xhr.readyState == 4 && xhr.status == 200) {
@ -153,6 +152,7 @@
}; };
xhr.open(form.method, form.action, true); xhr.open(form.method, form.action, true);
xhr.send(formData); xhr.send(formData);
});
} // img.onload } // img.onload
} }
// Load files into file reader // Load files into file reader