gfcarvalho/xhrImageDemo.html

## xhrImageDemo.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
    <canvas id="cnv" width="100" height="100"></canvas>
<script>
    var ctx = document.getElementById('cnv').getContext('2d');

    var xhr2 = new XMLHttpRequest();
    xhr2.open("GET", 'myImage.png');
    xhr2.responseType = "blob"
    xhr2.send(null);
    xhr2.onload = function () {
        var img = new Image();
        img.src = window.URL.createObjectURL(xhr2.response);

        img.onload = function() {
            ctx.drawImage(img, 0, 0);
        }
    }


</script>
</body>
</html>
	<!DOCTYPE html>
	<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<title></title>
	</head>
	<body>
	<canvas id="cnv" width="100" height="100"></canvas>
	<script>
	var ctx = document.getElementById('cnv').getContext('2d');

	var xhr2 = new XMLHttpRequest();
	xhr2.open("GET", 'myImage.png');
	xhr2.responseType = "blob"
	xhr2.send(null);
	xhr2.onload = function () {
	var img = new Image();
	img.src = window.URL.createObjectURL(xhr2.response);

	img.onload = function() {
	ctx.drawImage(img, 0, 0);
	}
	}


	</script>
	</body>
	</html>