我正在使用XMLHttpRequest从服务器获取图像(从第三方服务器小程序本地运行)
代码的简化版本如下所示.
图像以JPEG格式返回,返回的标题显示“content-type = image / jpg”.我可以通过Firebug for Firefox查看信息.
但是我有一个糟糕的时间能够在网页上显示实际图像,因为它是从服务器返回的图像数据而不是图像位置的uri.
从返回的数据中显示此图像的正确方法是什么?我应该使用< span>标签或< img>标签或< magical-show-image-from-data>标签?
function getXML(url,postData,requestStateChangeHandler){ if(window.XMLHttpRequest) {// code for IE7+,Firefox,Chrome,Opera,Safari xmlhttp=new XMLHttpRequest(); } else {//Code for IE6,IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = requestStateChangeHandler; xmlhttp.open("POST",url,true); xmlhttp.setRequestHeader('Content-Type','text/xml'); xmlhttp.setRequestHeader('Cache-Control','no-cache'); xmlhttp.send(postData); } function requestStateChangeHandler(){ if (xmlhttp.readyState == 4) { if(xmlhttp.status == 200) { document.getElementById('results').innerHTML = xmlhttp.responseText; } else dump("Error loading page\n"); } }
解决方法
您可以使用内嵌图像
在服务器端编码您在base64中的响应
在PHP中使用base64_encode(“你的数据”)
并在JavaScript中
result = document.getElementById('results'); result.innerHTML = '<img src="data:image/gif;base64,' + xmlhttp.responseText + '"/>';