简体   繁体   中英

js: send base64 string to php server page

I have a problem in sending a base64 image string (embedded in json object) to the server.

here is the Js code:

var sMimeType;
var id_g;
var tipo_g;
var lang_g;

function fileLoaded(frEvnt){
    var sFBody = frEvnt.target.result;
    var sBodyBase64 = btoa(sFBody);
    var myobj = {my_id: id_g, my_tipo: tipo_g, my_lang:lang_g, img_mime_type: sMimeType, img_base64 :sBodyBase64};
    //$("#error").html(JSON.stringify(myobj));
    $.ajax({
      url: "up_img.php",
      data: JSON.stringify(myobj),
      type: 'POST',
      success:function(a) {/*window.location = tipo_g+".php?l="+lang_g*/alert(a);},
      error:function() {$("#error").html("error")}
    });

}
function Upload(id,tipo){
    lang = document[id].l.value;
    var oFile = document[id].img.files[0];
    id_g = id;
    tipo_g = tipo;
    lang_g = lang;
    if(oFile){
        var oFReader = new FileReader();
        oFReader.onload = fileLoaded;
        sMimeType = oFile.type;
          oFReader.readAsBinaryString(oFile);
    }

}

and here is the up_img.php

require_once('dbconn.php');
require_once('../utility/sec.php');


$json = json_decode(file_get_contents("php://input"),true);

$id = "";
$id = $json['my_id'];
$lang = "";
$lang = $json['my_lang'];
$tipo = "";
$tipo = $json['my_tipo'];
$img_mime = "";
$img_mime = $json['img_mime_type'];
$img_base64 = "";
$img_base64 = base64_decode($json['img_base64']);
$event = new event($tipo,$lang);


$event->upload_img($img_base64,$img_mime,$id);

here's $event->upload_img($img_base64,$img_mime,$id);

public function upload_img($img,$mime,$id){
        if($this->check_img($id)){
            //$img = str_replace('data:image/png;base64,', '', $img);
            switch($mime){
                case "image/png": case "image/jpeg": case "image/jpg": case "image/gif": case "image/tiff":{
                    $img = str_replace(' ', '+', $img);
                    $data = $img;
                    $ext = explode('/',$mime);
                    $file = $this->get_folder_picture() . md5($id) . '.' . $ext[1];
                    $success = file_put_contents($file, $data);
                    if($success)
                    {
                         $newconn = new event($this->getTipo(),$this->getLang());
                         $newconn->open_conn();
                         $query = sprintf("insert into images (`Id`,`Ext`) values (%d,'%s')",
                            $id,$ext[1]);
                         $q = mysql_query($query,$newconn->getLink());
                         echo mysql_error($newconn->getLink());
                         $newconn->close_conn();

                    }else
                        echo 'Unable to save the file.';
                    break;
                }
                default:{
                    echo "not a valid image. image type accepted are jpge,jpg,png,tiff and gif: u gave ".$mime; 
                    break;
                }

            }

        }else{
            print "image error";    
        }
    }

the problem is that once I visualize the image stored in the server ( <img src=\\"$img\\" alt='' title='' class='box_img' name='img_view' /> where $img is the path of the image), I see something like this 在此输入图像描述

but my original image looks like this 在此输入图像描述

anyone can help me?

Found the solution! just removed the line

$img = str_replace(' ', '+', $img);

now the images look the same!!!!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM