将图像转换为base64时遇到问题,转换效果很好,但是当我尝试使用base64打开图像时,图像根本不出来,我不知道我遇到了什么问题。
<img id="imageid" src="http://localhost:8000/media/db.png" alt="">
getBase64Image() {
var data = document.getElementById("imageid");
html2canvas(data).then(canvas => {
var imgconverted = canvas.toDataURL("data:image/jpeg;base64");
console.log(imgconverted, 'base64');
});
}
这可能是很好的结果,但是我在浏览器中将其打开,并且图像不仅显示出一帧。
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAqQAAAG2CAYAAACpsJSkAAAXp0lEQVR4Xu3WwQkAMAwDsXb/oV3oEvdRFjCIPO5u23EECBAgQIAAAQIEIoErSCN5swQIECBAgAABAl9AkHoEAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBAQJD6AQIECBAgQIAAgVRAkKb8xgkQIECAAAECBASpHyBAgAABAgQIEEgFBGnKb5wAAQIECBAgQECQ+gECBAgQIECAAIFUQJCm/MYJECBAgAABAgQEqR8gQIAAAQIECBBIBQRpym+cAAECBAgQIEBAkPoBAgQIECBAgACBVECQpvzGCRAgQIAAAQIEBKkfIECAAAECBAgQSAUEacpvnAABAgQIECBA4AFcyNM5B/V48AAAAABJRU5ErkJggg==
无论出现什么问题,希望您能为我提供帮助。