After a time, the picture is drawn in the canvas. What is the problem?

Question

JavaScript

I upload an image to the server via a form

if($_FILES['stImage']['error'] == 0) {
    		if ($_FILES['stImage']['type'] == "image/jpg" ||
    			$_FILES['stImage']['type'] == "image/png" ||
    			$_FILES['stImage']['type'] == "image/gif" ||
    			$_FILES['stImage']['type'] == "image/bmp" ||
    			$_FILES['stImage']['type'] == "image/jpeg") {
    			move_uploaded_file($_FILES['stImage']['tmp_name'], 'upl/'.$_FILES['stImage']['name']);
    		}
}

$stImage = 'upl/'.$_FILES['stImage']['name'];

And I draw in canvas

var steamIcon = new Image();
steamIcon.src = '<?php echo $stImage ?>';

steamIcon.onload = function() {
    Icon.drawImage(steamIcon, 14, 14, 64, 64);
}

But after a while the picture does not appear, after a couple of page reloads it appears, if you reload it again, it may disappear again, and if it appears again ... How to fix it?

Answer 1

move_uploaded_file($_FILES['stImage']['tmp_name'], 'upl/'.$_FILES['stImage']['name']);

Somehow it's not safe ...
And in those moments when the picture is not rendered, did you look at the source code? Namely the line:steamIcon.src = '...';