<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>nick getBase64</title>
</head>
<body>
<div>
<canvas id="canvas" style="display: none"></canvas>
<img id="canvasImg" />
</div>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
var img = new Image();
var canvas = document.createElement("canvas");
function getImageBlob (url, cb) {
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'blob';
xhr.onload = function () {
if (this.status == 200) {
console.log(this.response)
img.src = URL.createObjectURL(this.response);
}
};
xhr.send();
}
img.onload = function () {
canvas.width = img.width;
canvas.height = img.height + 200;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
document.getElementById('canvasImg').src = canvas.toDataURL("image/jpeg", 1);
}
getImageBlob('https://msb-ai.meixiu.mobi/ai-pm/static/touxiang.png');
</script>
</body>
</html>