显示数据库中的base64图像 [英] Display base64 image from database

问题描述

我的代码有问题吗?我问是因为我无法在浏览器中显示图像.我试图将base64图像解码为png，但仍然无法显示该图像.我的网址格式如下: 数据:image/jpeg; base64，iVBORw0kGgoAAAANSUhgAAAeAA ...

Is there something wrong with my code? I am asking because I failed to display the image in my browser. I have tried to decode the base64 image into png but I'm still not able to display the image. My URL format as below: data:image/jpeg;base64,iVBORw0kGgoAAAANSUhgAAAeAA...

我的php代码

    //Connect to database
    mysql_connect("localhost", "root", "") or die(mysql_error());
    mysql_select_db("studioassessor_01") or die (mysql_error());

    $sql = "SELECT * FROM frame";
    $result = mysql_query($sql);

    if($result == FALSE){
       die(mysql_error());
    }

    while($row = mysql_fetch_array($result)){

        header("Content-type: image/png");
        echo '<img src="data:image/png;base64,' . base64_decode($row['url']) . '" />';

   }

经过多轮测试后，我发现ajax脚本中的请求标头部分有问题.请求标头已将我的base 64字符串值更改为另一个值.

After I have test for many rounds, I found that there is something wrong to my request header part in ajax scripting. The request header had changed my base 64 string value to another value.

            function saveIt(){

                var xmlhttp = new XMLHttpRequest();

                xmlhttp.onreadystatechange = function() {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        alert("Save successfully!");
                    }
                }

                var value1 = document.getElementById("url").value ;
                var value2 = document.getElementById("time").value;
                var value3 = document.getElementById("note").value;

                xmlhttp.open("POST", "insertFrame.php", true);
                xmlhttp.setRequestHeader("Content-type:image/png","application/x-www-form-urlencoded");
                xmlhttp.send("url="+ value1 + "&time=" + value2 + "&note=" + value3);

            }

那么，我可以再问一问我该对xmlhttp.setRequestHeaderPart做什么吗?

So, may I ask again what should i do for the xmlhttp.setRequestHeaderPart?

推荐答案

是的，您正在将base64数据解码为原始二进制文件，但告诉浏览器它仍然是base64.那是行不通的.

Yes, you're decoding the base64 data into raw binary, but telling the browser that it's still base64. That's not going to work.

echo '<img src="data:image/png;base64,' . $row['url'] . '" />';

应该是您所需要的.根本没有解码调用.请注意，即使您愿意，也无法将原始二进制文件真正转储到数据uri中-它会随机地(自然地)包含"和其他html元字符，从而引起html注入问题.您必须先htmlspecialchars()二进制字符串，然后找出是否存在raw-binary-with-html-characters-escaped

should be all you need. no decode call at all. Note that you couldn't really dump the raw binary into a data uri, even if you wanted to - it will randomly (and naturally) contain " and other html meta-characters, introducing html injection problems. you'd have to htmlspecialchars() the binary string, and then figure out if there's an encoding type raw-binary-with-html-characters-escaped

这篇关于显示数据库中的base64图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！