I have the below code that does the conversion from a photo to base string64 sends the base via AJAX to the controller , however when you switch to the ajax, I return the following error:
Photo conversion is done without errors.
Isthereanywaytoshorten/camouflagethebaseinordertoavoidthiserror?
Followingcodes:
<scripttype="text/javascript">
$(document).ready(function () {
});
function mostraImagem(img) {
if (img.files && img.files[0]) {
var fileExtension = ['jpeg', 'jpg', 'png', 'bmp'];
if ($.inArray($(img).val().split('.').pop().toLowerCase(), fileExtension) == -1) {
swal('', 'Formato do arquivo inválido! Somente JPG, JPEG, PNG, BMP são permitidos.', 'warning');
$("#FileUpload1").val('');
$("#imgImage").val('');
return false;
sizes = input.files[0].size;
if (parseInt(sizes) > 100000) {
swal("", "Tamanho do arquivo inválido! Tamanho máximo permitido 100 KB", 'warning');
$("#FileUpload1").val('');
$("#imgImage").val('');
return false;
}
}
var reader = new FileReader();
var imgConvertida = null;
var imagem = document.getElementById("imgImage");
reader.onload = function (e) {
imagem.src = e.target.result;
imgConvertida = imagem.src;
};
}
reader.readAsDataURL(img.files[0]);
SetarImagem(imgConvertida);
}
function SetarImagem(imgConvertida) {
$.ajax({
type: "POST",
url: "/MeusDados/SetarImagem?img=" + imgConvertida,
//data: "{'img': '" + img + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function (data) {
//alert(data);
}
});
}
</script>
<div class="dois_quintos">
<input type="file" ID="FileUpload1" onChange="mostraImagem(this);" />
<br />
@if (Model.CliFoto != null)
{
<img ID="imgImage" src="data:image/jpg;base64, @Convert.ToBase64String(Model.CliFoto)" style="width: 143px; height: 138px;" />
}
else
{
<img ID="imgImage" src="~/images/avatarDefault.png" style="width: 143px; height: 138px;" />
}
</div>