0

ユーザーがカメラから写真をアップロードできるモバイル Web サイトを構築しています。

ユーザーのアルバムから画像を取得できます。また、ユーザーが iPhone4 および Android 4 の iOS6 で写真を撮ったときに画像を取得できますが、ユーザーが iPhone5 (同じく iOS6 を使用) で写真を撮ったときに何も取得しません。ユーザーのフォトアルバムから画像を取得できますが、写真を撮るときは取得できません。

ここにコードとjsfiddleがあります

$('input#file_api').change(function(evt){
    var image = evt.target.files[0];
    var reader = new FileReader();
    reader.onerror  = (function(){alert('error reading file')});
        reader.onload = (function(theFile) {
        return function(e) {
          // Render thumbnail.
          var tempImg = new Image();

          tempImg.src = reader.result;
          tempImg.onload = function(){
             var canvas = document.createElement('canvas');
                   canvas.width=tempImg.width;
            canvas.height=tempImg.height;
             var ctx = canvas.getContext("2d");

                ctx.drawImage(tempImg,0,0);

               $('body').append(canvas);
})(image);
      reader.readAsDataURL(image);

ここに例がありますhttp://jsfiddle.net/8DJUy/4/

ファイル ピッカーを使用して写真を取得すると、その写真がページに追加されます。iPhone5で写真を撮った場合、何も追加されません。しかし同時に、エラーも発生しません。

これを回避する方法について何か提案はありますか?

写真を取得する際に何が問題なのか、よくわかりません。

このように写真を取得している理由は、携帯電話から直接アップロードするとファイル サイズが非常に大きくなるためです。ユース ケースでは高解像度の画像は必要ないため、アップロードする前にキャンバスを使用して画像のサイズを変更しています。 .

4

1 に答える 1

1

代わりにこれを試してください：

ctx.drawImage(tempImg, 0, 0, canvas.width, canvas.height);
于 2013-01-03T03:54:15.190 に答える