I’m trying to display a blob image stored in a database, I’m not getting any errors but the image isn’t displaying, I’m just getting the default “no image” icon. Here’s my code:
<script>
function showEmpimg(str) {
var xhttp;
if (str == "") {
document.getElementById("user-id").innerHTML = "";
return;
}
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("face").innerHTML = this.responseText;
}
};
xhttp.open("POST", "getimage.php?q="+str, true);
xhttp.send();
}
</script>
</head>
<body>
<div id="face" class="face">
</div>
<input type="text" class="form-control" id="user-id" placeholder="ID" name="emp_id" onchange="showEmpimg(this.value)" required maxlength="6" />
And the php file:
<?php
$db = mysqli_connect("localhost","root","test1","dar");
$sql = "SELECT emp_img FROM employees WHERE emp_id LIKE 'q'";
$sth = $db->query($sql);
$result=mysqli_fetch_array($sth);
echo '<img src="data:image/jpeg;base64,'.base64_encode( $result['emp_img'] ).'"/>';
?>
Any ideas?