我有一个注册表单,用户可以在其中选择头像。他们有两种可能性:
- 选择默认头像
- 上传自己的头像
在我的 HTML 页面中有这个。
<img id="preview" src="img/default_1.png">
它显示选择的头像。 我使用 File Api 让用户上传自己的图像。 这使得 HTML 图像的 src 变成了这样的东西。
<img id="preview" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA... />
当他们发布注册表时。数据将被发送到 REST 服务。 当用户自己上传头像时,我可以发送 base64 编码的数据。但是我该如何处理默认头像呢?它是一个 url 而不是 base64 编码的数据。
最佳答案
您可以尝试以下示例 http://jsfiddle.net/xKJB8/3/
<img id="preview" src="http://www.gravatar.com/avatar/0e39d18b89822d1d9871e0d1bc839d06?s=128&d=identicon&r=PG">
<canvas id="myCanvas" />
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("preview");
ctx.drawImage(img, 10, 10);
alert(c.toDataURL());
关于javascript - 如何从html图像中获取base64编码的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15760764/