toDataURL（）iOSデバイスから白紙イメージを返す

Question

私は画像をトリミングし、それを

this.crop = function(width, height, type) { 
      var imgInfo = this.imgInfo, 
       c = this.eles.container, 
       img = this.eles.img, 
       original = new Image(), 
       canvas = document.createElement('canvas'); 
      original.src = img.attr('src'); 
      canvas.width = width; 
      canvas.height = height; 

      var w = Math.round(c.width() * (imgInfo.aw/(imgInfo.w * imgInfo.s))), 
       h = Math.round(c.height() * (imgInfo.ah/(imgInfo.h * imgInfo.s))), 
       x = Math.round(-parseInt(img.css('left')) * (imgInfo.aw/(imgInfo.w * imgInfo.s))), 
       y = Math.round(-parseInt(img.css('top')) * (imgInfo.ah/(imgInfo.h * imgInfo.s))); 
      canvas.getContext('2d').drawImage(original, x, y, w, h, 0, 0, width, height); 
      return { 
       width: width, 
       height: height, 
       type: type || 'jpeg', 
       string: canvas.toDataURL("image/" + type || 'jpeg'), 
      }; 
     }; 

を保存するには、次のコードを使用しますが、私は画像に変換して、サーバーにアップロードするとき。アップロードされた画像は空白です。このため

私は細かい作業PCのすべてのものから、save.phpファイル

<?php 
if($_SERVER['REQUEST_METHOD'] == "POST") { 
    define('UPLOAD_DIR', 'img/catalog/'); 

    $base64 = base64_decode(preg_replace('#^data:image/[^;]+;base64,#', '', $_POST['string'])); 
    $stamp = imagecreatefrompng('img/water.png'); 
    $im = imagecreatefromstring($base64); 
    ob_start(); 

    $marge_right = 10; 
    $marge_bottom = 10; 
    $sx = imagesx($stamp); 
    $sy = imagesy($stamp); 

    imagecopy($im, $stamp, imagesx($im) - $sx - $marge_right, imagesy($im) - $sy - $marge_bottom, 0, 0, imagesx($stamp), imagesy($stamp)); 

    $file = UPLOAD_DIR . uniqid() . '.jpg'; 
    header('Content-type: image/'); 
    $success = imagejpeg($im, $file, 100); 
    imagedestroy($im); 
    echo "$file"; 

    } 

?> 

からコードを以下の使用しますが、私は任意のモバイル機器から画像をアップロードする際の画像は空白です。私はそれを最大サイズにズームするときにうまく動作します。

私はどこが間違っているか教えていただけますか？

Answer 1

私は自分のスクリプトを変更しました。

this.data = function(width, height, filetype) { 

      var self = this, 
       imgInfo = self.imgInfo, 
       c = self.eles.container, 
       img = self.eles.img; 

      var original = new Image(); 
       original.src = img.attr('src'); 

      // draw image to canvas 
      var canvas = document.createElement('canvas'); 
       canvas.width = width; 
       canvas.height = height; 

      var w = Math.round((c.width() - (0 * 2)) * (imgInfo.aw/(imgInfo.w * imgInfo.s))), 
       h = Math.round((c.height() - (0 * 2)) * (imgInfo.ah/(imgInfo.h * imgInfo.s))), 
       x = Math.round(-(parseInt(img.css('left')) - 0) * (imgInfo.aw/(imgInfo.w * imgInfo.s))), 
       y = Math.round(-(parseInt(img.css('top')) - 0) * (imgInfo.ah/(imgInfo.h * imgInfo.s))); 

      canvas.getContext('2d').drawImage(original, x, y, w, h, 0, 0, width, height); 

      data = { 
       width: width, 
       height: height, 
       image: canvas.toDataURL("image/"+filetype), 
       filetype: filetype 
      }; 

      return data; 
     }; 

これはiOSでも動作しますが、別の問題があります。カメラから写真をアップロードすると、自動的に回転します。