javascript - 通过 Ajax 的图像数据 - 如何在页面上显示图像

Question

我正在通过 AJAX 创建包含照片的 Domino 文档。 我能够在 Notes Domino 文档中将 base64 图像数据返回到服务器。

数据存储在 Richtext (textarea) 字段中作为

"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAFA..........." - (this goes on for several lines)

我正在尝试使用 passthru 标记在 Domino 网页上显示

<<image id= "pic1" >>

在表单的 onLoad 事件中，我尝试使用以下代码将数据推送到图像元素中:

//Photo Stuff
alert(document.forms[0].photo1.value);
document.getElementById("pic1").src = document.forms[0].photo1.value;

警报正在显示数据。 图片未显示。

请帮忙。
谢谢
迈克

Answer 1

我的印象是内联图像可以使用数据 URI。

喜欢:

<img src="data:image/png;base64,
Your base 64 source. . . "/>

或者

document.getElementById("pic1").src = 
   'data:image/png;base64,' + document.forms[0].photo1.value;

编辑:经过测试...这是一个 jsFiddle:

http://www.jsfiddle.net/UySAb/1/

Mozilla 的相关信息:https://developer.mozilla.org/en/The_data_URL_scheme

注意:Josiah 在他的评论中也是正确的，您的目标标签需要是 img，而不是图像。