javascript - 在请求中使用数据 URI 发送的 Canvas 图像在保存后损坏

Question

这是我的 JavaScript 代码:

function common_save_project()
{
  var image = common_screenshot();
  $.ajax
  (
    {
      type: "POST",
      processData: false,
      url:  SITE_URL + "/system/xml/import/" + app_type + "/" + session_id + "/?prjid=" + project_id,
      data: "xml=" + common_order_xml + "&prodid=" + product_id + "&file=" + image.src
    }
  ).done(function( msg ) 
  {
      alert("Project saved. " + msg);
  });
}

function common_screenshot()
{
  var canvas = document.getElementById("save_image_canvas");
  rasterizeHTML.drawHTML(document.getElementById("mattes").innerHTML, canvas);
  var ctx = canvas.getContext('2d');
  ctx.drawImage(matte_canvas, 0, 0);
  var image = new Image();
    image.src = canvas.toDataURL("image/jpeg");
  return image;
}

这是 PHP 代码:

function xmlp_import_project ( $type, $sessid ) {
  // save the jpg thumbnail file
  $jpg = xmlp_f_save_jpg( $_POST['file'] );
}

function xmlp_f_save_jpg( $jpgContents ) {

    // random file name then MD5.
    $fid = MD5(rand().rand());

    $filename = $fid.'.jpg';

    $tmpDir = FILES_DIR_PATH."tmp/";
    $destDir = FILES_DIR_PATH."projects/";

    $tmpFile = $tmpDir . $filename;
    $destFile = $destDir . $filename;

    // write temp file
    $fp = fopen($tmpFile, 'a');
    fwrite($fp, base64_decode($jpgContents));
    fclose($fp);

    // make sure the dest file is unique
    while(is_file($destFile)){
        $fid = MD5(rand().rand());
        $filename = $fid.'.jpg';
        $destFile = $destDir . $filename;
    }

    db_query("INSERT INTO {xmlp_files} ( fid, filename, filepath ) VALUE ( '%s', '%s', '%s' )", $fid, $filename, $destDir);

    // copy file to correct destination
    if(copy($tmpFile, $destFile))
        return $fid;
    else{
            drupal_set_message("xmlproject_func : Image not Found");
        return FALSE;
        }

    // delete tmp file
    unlink($tmpFile);
}

HTML:

<div id="mattes" style="width: 247.5px; height: 292.5px; left: 201.25px; top: 23.75px;">  
  <div id="opening_0" style="background-color: #bfbfbf; position: absolute; left: 45px; top: 45px; height: 202.5px; width: 157.5px; overflow: hidden; z-index: 6;" ondrop="drag_drop_drop(event, this)" ondragover="drag_drop_allow_drop(event)" onclick="photos_add_selected_fid(this);">&nbsp;</div>
  <canvas id="matte_canvas" width="247" height="292" style="z-index: 3; position: relative; background-color: rgb(255, 255, 255);">
  </canvas>
</div>

这是图像数据:

data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMD…DhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4 Tl5ufo6erx8vP09fb3 Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3 Pn6/9oADAMBAAIRAxEAPwD9U6KKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA8q/ax/5NY Mn/ZP/EP/AKbp6/msr lP9rH/AJNY Mn/AGT/AMQ/ m6ev5rKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigD qiiiigAoorn/AB5488M/DXwzP4v8X3V3BpsFxaWhNpp9xfTyT3NxHbW8UdvbJJNK7zTRIFRGOXFAHQUV5V/w0t8Ov hc Kv/AIafxV/8rqP Glvh1/0LnxV/8NP4q/8AldQB6rRXlX/DS3w6/wChc Kv/hp/FX/yuo/4aW HX/QufFX/AMNP4q/ V1AHqtFeVf8ADS3w6/6Fz4q/ Gn8Vf8Ayuo/4aW HX/QufFX/wANP4q/ V1AHqtFeVf8NLfDr/oXPir/AOGn8Vf/ACuo/wCGlvh1/wBC58Vf/DT Kv8A5XUAeq0V5V/w0t8Ov hc Kv/AIafxV/8rqP Glvh1/0LnxV/8NP4q/8AldQB6rRXlX/DS3w6/wChc Kv/hp/FX/yuo/4aW HX/QufFX/AMNP4q/ V1AHqtFeVf8ADS3w6/6Fz4q/ Gn8Vf8Ayuo/4aW HX/QufFX/wANP4q/ V1AHqtFeVf8NLfDr/oXPir/AOGn8Vf/ACuo/wCGlvh1/wBC58Vf/DT Kv8A5XUAeq0V5V/w0t8Ov hc Kv/AIafxV/8rqP Glvh1/0LnxV/8NP4q/8AldQB6rRXlX/DS3w6/wChc Kv/hp/FX/yuo/4aW HX/QufFX/AMNP4q/ V1AHqtFeVf8ADS3w6/6Fz4q/ Gn8Vf8Ayuo/4aW HX/QufFX/wANP4q/ V1AHqtFeVf8NLfDr/oXPir/AOGn8Vf/ACur0Xw/rll4l0a017ToNQhtr2PzY01DTriwuFHpJb3CJLEePuuin2oA0KKKKAPKv2sf TWPjJ/2T/xD/wCm6ev5rK/pT/ax/wCTWPjJ/wBk/wDEP/punr aygAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA/qoooooAK8q/aW/5J1pH/ZQPAn/qVaXXqteVftLf8k60j/soHgT/ANSrS6AOq IvxF0r4a6VY6pqmlarqP8AaOoRaZbW2mQLNPJPIrsgCMy5zsIwCTkgAVyv/C/f qK/FX/wnP8A7ZR8ff8AmnH/AGUDSP8A2rVT9qD9qDwD yZ4A0/4jfEbSPEGo6bqOsRaJFFolvDNOs8kM0ysyzSxKE227gkMTkrx1IALf/C/f qK/FX/AMJz/wC2Uf8AC/f qK/FX/wnP/tlfKv/AA r/ZY/6EH4q/8Agq07/wCTqP8Ah9X yx/0IPxV/wDBVp3/AMnUAfVX/C/f qK/FX/wnP8A7ZR/wv3/AKor8Vf/AAnP/tlfKv8Aw r/AGWP hB Kv8A4KtO/wDk6j/h9X yx/0IPxV/8FWnf/J1AH1V/wAL9/6or8Vf/Cc/ 2Uf8L9/6or8Vf8AwnP/ALZXyr/w r/ZY/6EH4q/ CrTv/k6j/h9X yx/wBCD8Vf/BVp3/ydQB9Vf8L9/wCqK/FX/wAJz/7ZR/wv3/qivxV/8Jz/AO2V8q/8Pq/2WP8AoQfir/4KtO/ TqP H1f7LH/Qg/FX/wAFWnf/ACdQB9Vf8L9/6or8Vf8AwnP/ALZR/wAL9/6or8Vf/Cc/ 2V8q/8AD6v9lj/oQfir/wCCrTv/AJOo/wCH1f7LH/Qg/FX/AMFWnf8AydQB9Vf8L9/6or8Vf/Cc/wDtlH/C/f8AqivxV/8ACc/ 2V8q/wDD6v8AZY/6EH4q/wDgq07/AOTqP H1f7LH/Qg/FX/wVad/8nUAfVX/AAv3/qivxV/8Jz/7ZR/wv3/qivxV/wDCc/8AtlfKv/D6v9lj/oQfir/4KtO/ TqP H1f7LH/AEIPxV/8FWnf/J1AH1V/wv3/AKor8Vf/AAnP/tlH/C/f qK/FX/wnP8A7ZXyr/w r/ZY/wChB Kv/gq07/5Oo/4fV/ssf9CD8Vf/AAVad/8AJ1AH1V/wv3/qivxV/wDCc/8AtlH/AAv3/qivxV/8Jz/7ZXyr/wAPq/2WP hB Kv/AIKtO/8Ak6j/AIfV/ssf9CD8Vf8AwVad/wDJ1AH1V/wv3/qivxV/8Jz/AO2Uf8L9/wCqK/FX/wAJz/7ZXyr/AMPq/wBlj/oQfir/AOCrTv8A5Or6n/Zo/aT8DftUfDqT4m/D3Std0/S4tSm0sw6zBDFcebEkbMdsUsi7cSLg7s8HgUAeheFtf/4SjQrXXf7E1XSPtO//AEPVLb7PdRbXZfnjydudu4c8qQe9a1FFABRRRQB5V 1j/wAmsfGT/sn/AIh/9N09fzWV/Sn 1j/yax8ZP yf If/AE3T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8AJOtI/wCygeBP/Uq0uvVa8q/aW/5J1pH/AGUDwJ/6lWl0AHx9/wCacf8AZQNI/wDatfKv/Bav/k1jwt/2UCx/9N2o19VfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/AARt/wCTR7z/ALHDUf8A0RbUAfdVFFFABRRRQB5V 1j/AMmsfGT/ALJ/4h/9N09fzWV/Sn 1j/yax8ZP yf If8A03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/wBSrS69Vryr9pb/AJJ1pH/ZQPAn/qVaXQAfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNfVXx9/5px/2UDSP/atfKv8AwWr/AOTWPC3/AGUCx/8ATdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/AERbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If/AE3T1/NZX9Kf7WP/ACax8ZP yf8AiH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/ANSrS69Vryr9pb/knWkf9lA8Cf8AqVaXQAfH3/mnH/ZQNI/9q18q/wDBav8A5NY8Lf8AZQLH/wBN2o19VfH3/mnH/ZQNI/8AatfKv/Bav/k1jwt/2UCx/wDTdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/AARt/wCTR7z/ALHDUf8A0RbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If8A03T1/NZX9Kf7WP8Ayax8ZP8Asn/iH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/1KtLr1WvKv2lv SdaR/2UDwJ/6lWl0AHx9/5px/2UDSP/AGrXyr/wWr/5NY8Lf9lAsf8A03ajX1V8ff8AmnH/AGUDSP8A2rXyr/wWr/5NY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/BG3/k0e8/7HDUf/AERbUAfdVFFFABRRRQB5V 1j/wAmsfGT/sn/AIh/9N09fzWV/Sn 1j/yax8ZP yf If/AE3T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8AJOtI/wCygeBP/Uq0uvVa8q/aW/5J1pH/AGUDwJ/6lWl0AHx9/wCacf8AZQNI/wDatfKv/Bav/k1jwt/2UCx/9N2o19VfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/AARt/wCTR7z/ALHDUf8A0RbUAfdVFFFABRRRQB5V 1j/AMmsfGT/ALJ/4h/9N09fzWV/Sn 1j/yax8ZP yf If8A03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/wBSrS69Vryr9pb/AJJ1pH/ZQPAn/qVaXQAfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNfVXx9/5px/2UDSP/atfKv8AwWr/AOTWPC3/AGUCx/8ATdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/AERbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If/AE3T1/NZX9Kf7WP/ACax8ZP yf8AiH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/ANSrS69Vryr9pb/knWkf9lA8Cf8AqVaXQAfH3/mnH/ZQNI/9q18q/wDBav8A5NY8Lf8AZQLH/wBN2o19VfH3/mnH/ZQNI/8AatfKv/Bav/k1jwt/2UCx/wDTdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/AARt/wCTR7z/ALHDUf8A0RbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If8A03T1/NZX9Kf7WP8Ayax8ZP8Asn/iH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/1KtLr1WvKv2lv SdaR/2UDwJ/6lWl0AHx9/5px/2UDSP/AGrXyr/wWr/5NY8Lf9lAsf8A03ajX1V8ff8AmnH/AGUDSP8A2rXyr/wWr/5NY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/BG3/k0e8/7HDUf/AERbUAfdVFFFABRRRQB5V 1j/wAmsfGT/sn/AIh/9N09fzWV/Sn 1j/yax8ZP yf If/AE3T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8AJOtI/wCygeBP/Uq0uvVa8q/aW/5J1pH/AGUDwJ/6lWl0AHx9/wCacf8AZQNI/wDatfKv/Bav/k1jwt/2UCx/9N2o19VfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/AARt/wCTR7z/ALHDUf8A0RbUAfdVFFFABRRRQB5V 1j/AMmsfGT/ALJ/4h/9N09fzWV/Sn 1j/yax8ZP yf If8A03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/wBSrS69Vryr9pb/AJJ1pH/ZQPAn/qVaXQAfH3/mnH/ZQNI/9q18q/8ABav/AJNY8Lf9lAsf/TdqNfVXx9/5px/2UDSP/atfKv8AwWr/AOTWPC3/AGUCx/8ATdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/AERbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If/AE3T1/NZX9Kf7WP/ACax8ZP yf8AiH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/ANSrS69Vryr9pb/knWkf9lA8Cf8AqVaXQAfH3/mnH/ZQNI/9q18q/wDBav8A5NY8Lf8AZQLH/wBN2o19VfH3/mnH/ZQNI/8AatfKv/Bav/k1jwt/2UCx/wDTdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/AARt/wCTR7z/ALHDUf8A0RbV INft9/wRt/5NHvP xw1H/0RbUAfdVFFFABRRRQB5V 1j/yax8ZP yf If8A03T1/NZX9Kf7WP8Ayax8ZP8Asn/iH/03T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8k60j/soHgT/1KtLr1WvKv2lv SdaR/2UDwJ/6lWl0AHx9/5px/2UDSP/AGrXyr/wWr/5NY8Lf9lAsf8A03ajX1V8ff8AmnH/AGUDSP8A2rXyr/wWr/5NY8Lf9lAsf/TdqNAH4rUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAV 33/BG3/k0e8/7HDUf/RFtX4g1 33/BG3/k0e8/7HDUf/AERbUAfdVFFFABRRRQB5V 1j/wAmsfGT/sn/AIh/9N09fzWV/Sn 1j/yax8ZP yf If/AE3T1/NZQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf1UUUUUAFeVftLf8AJOtI/wCygeBP/Uq0uvVa8q/aW/5J1pH/AGUDwJ/6lWl0AHx9/wCacf8AZQNI/wDatfLv/BZ7TtQ1P9l7wvBptjcXcq PrJykETSMF/s7UBnAHTJH519WfG3SdV1b/hAf7L0y7vPsfjjSru5 zwtJ5MCeZvlfaDtQZGWPAyM16XQB/LZ/wifir/oWdV/8ApP8KP8AhE/FX/Qs6r/4BSf4V/UnRQB/LZ/wifir/oWdV/8AAKT/AAo/4RPxV/0LOq/ AUn Ff1J0UAfy2f8In4q/wChZ1X/AMApP8KP ET8Vf8AQs6r/wCAUn Ff1J0UAfy2f8ACJ Kv hZ1X/wCk/wo/4RPxV/0LOq/wDgFJ/hX9SdFAH8tn/CJ Kv hZ1X/wCk/wo/wCET8Vf9Czqv/gFJ/hX9SdFAH8tn/CJ Kv hZ1X/wAApP8ACj/hE/FX/Qs6r/4BSf4V/UnRQB/LZ/wifir/AKFnVf8AwCk/wo/4RPxV/wBCzqv/AIBSf4V/UnRQB/LZ/wAIn4q/6FnVf/AKT/Cj/hE/FX/Qs6r/AOAUn Ff1J0UAfy2f8In4q/6FnVf/AKT/Cj/AIRPxV/0LOq/ AUn Ff1J0UAfy2f8In4q/6FnVf/AACk/wAK/a7/AII72l1Y/snX1re20tvMnjDUN0cqFGXNvakZB5HBBr7looAKKKKACiiigDyr9rH/AJNY Mn/AGT/AMQ/ m6ev5rK/pT/AGsf TWPjJ/2T/xD/wCm6ev5rKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigD qiiiigArzr49aBrPiXwPpmnaDp0t7cw NPB oPHEMlbe18RafcXEn0SGKRz7Ia9FooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKAPKv2sf TWPjJ/2T/xD/wCm6ev5rK/pT/ax/wCTWPjJ/wBk/wDEP/punr aygAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA/qoooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigDyr9rH/k1j4yf9k/8AEP8A6bp6/msr lP9rH/k1j4yf9k/8Q/ m6ev5rKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigD9VP H53/Vrv/l7f/cFH/D87/q13/y9v/uCvyrooA/VT/h d/1a7/5e3/3BR/w/O/6td/8AL2/ 4K/KuigD9VP H53/AFa7/wCXt/8AcFH/AA/O/wCrXf8Ay9v/ALgr8q6KAP1U/wCH53/Vrv8A5e3/ANwUf8Pzv rXf/L2/wDuCvyrooA/VT/h d/1a7/5e3/3BR/w/O/6td/8vb/7gr8q6KAP1U/4fnf9Wu/ Xt/9wUf8Pzv rXf/AC9v/uCvyrooA/VT/h d/wBWu/8Al7f/AHBR/wAPzv8Aq13/AMvb/wC4K/KuigD9VP8Ah d/1a7/AOXt/wDcFH/D87/q13/y9v8A7gr8q6KAP1U/4fnf9Wu/ Xt/9wUf8Pzv rXf/L2/ 4K/KuigD9VP H53/Vrv/l7f/cFH/D87/q13/wAvb/7gr8q6KAP1U/4fnf8AVrv/AJe3/wBwUf8AD87/AKtd/wDL2/8AuCvyrooA/VT/AIfnf9Wu/wDl7f8A3BR/w/O/6td/8vb/AO4K/KuigD9VP H53/Vrv/l7f/cFH/D87/q13/y9v/uCvyrooA/VT/h d/1a7/5e3/3BR/w/O/6td/8AL2/ 4K/KuigD9VP H53/AFa7/wCXt/8AcFH/AA/O/wCrXf8Ay9v/ALgr8q6KAP0p LH/AAWU/wCFofCzxl8M/wDhnH zP Et8P6joX23/hL/ADvsv2q2kh83y/sS79vmbtu5c4xkZzX5rUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAf/Z

当从以前开发的 Flex 程序调用时，php 工作得很好，但我们正在放弃它。我不知道如何使用 javascript 来完成这项工作。

编辑: 我找到了解决方案:http://www.php.net/manual/en/function.base64-decode.php#104193 $data = str_replace(' ','+',$data);它生成了一个图像，但现在图像的中间是黑色的，我不知道为什么。

Answer 1

因为您要将图像设为 DataURL，所以您需要在服务器上处理图像数据，因此您可以:

// write temp file
$fp = fopen($tmpFile, 'a');
fwrite($fp, base64_decode($jpgContents));
fclose($fp);

应该是:

$data = $jpgContents;
list($t, $data) = explode(';', $data);
list(, $data)      = explode(',', $data);
$data = base64_decode($data);

file_put_contents($tmpFile, $data);

我们正在做的是取出 dataURL 信息:

data:[<MIME-type>][;charset=<encoding>][;base64],<data>

并且只保留<data>部分。您可以通过以下网址了解更多信息:http://en.wikipedia.org/wiki/Data_URI_scheme

这就是你的函数的样子:

function xmlp_f_save_jpg( $jpgContents ) {

    // random file name then MD5.
    $fid = MD5(rand().rand());

    $filename = $fid.'.jpg';

    $tmpDir = FILES_DIR_PATH."tmp/";
    $destDir = FILES_DIR_PATH."projects/";

    $tmpFile = $tmpDir . $filename;
    $destFile = $destDir . $filename;

    $data = $jpgContents;
    list($t, $data) = explode(';', $data);
    list(, $data)      = explode(',', $data);
    $data = base64_decode($data);

    file_put_contents($tmpFile, $data);

    // make sure the dest file is unique
    while(is_file($destFile)){
        $fid = MD5(rand().rand());
        $filename = $fid.'.jpg';
        $destFile = $destDir . $filename;
    }

    db_query("INSERT INTO {xmlp_files} ( fid, filename, filepath ) VALUE ( '%s', '%s', '%s' )", $fid, $filename, $destDir);

    // copy file to correct destination
    if(copy($tmpFile, $destFile))
        return $fid;
    else{
            drupal_set_message("xmlproject_func : Image not Found");
        return FALSE;
        }

    // delete tmp file
    unlink($tmpFile);
}