Question

我正在使用base64中的javascript图片发布。发布图像后，它始终显示无效图像。该如何解决？

我不明白是什么问题。

function encodeImageFileAsURL(element) {
  var file = element.files[0];
  var reader = new FileReader();
  reader.onloadend = function() {

			var xxhttp = new XMLHttpRequest();
            xxhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
               
							document.getElementById('output').src = "data:image/png;base64,//" + this.responseText + "";


                        
                                                        
                            }
                     };
                      xxhttp.open("POST", "itemimages.php", true);
                      xxhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                      xxhttp.send('image_data=' + reader.result);
        
  }
  reader.readAsDataURL(file);
}

<input type="file" accept="image/png" onchange="encodeImageFileAsURL(this)" />
<img id="output" src="" alt="" />

“ itemimages.php”文件中的我的php代码

$imagedata = $_POST['image_data'];

    $imagepath = "images/aa.png";

    $imagedata = preg_replace( '/data:image\/.*;base64,/', '', $imagedata );
     if(file_put_contents($imagepath,base64_decode($imagedata)))
     {
        echo "$imagedata"; 
     }

它包含一个加密的字符串，但该字符串未显示图像

Answer 1

如果您的数据正确到达php ...，您应该尝试

$imagedata = $_POST['image_data'];

$image_parts = explode(";base64,", $imagedata);
$image_type_aux = explode("image/", $image_parts[0]);
$image_base64 = base64_decode($image_parts[1]);

$imagepath = "images/aa." . $image_type_aux[1];

file_put_contents($imagepath , $image_base64);

--- javascript ---

function encodeImageFileAsURL(element) {
  var file = element.files[0];
  var reader = new FileReader();
  reader.onloadend = function() {
    console.log(reader.result)
  }
  reader.readAsDataURL(file);
}

-html-

<input type="file" onchange="encodeImageFileAsURL(this)">

javascript post base64加密和解密图像

1 个答案: