5

<input type="file" accept="image/*"/>タグを使用して、モバイル デバイスから写真をアップロードするための Web ページに取り組んでいます。これは、iphone と android の chrome で美しく動作しますが、問題が発生しているのは、標準の android ブラウザーです。

この問題は、ギャラリーからファイルを選択するときに発生します (カメラを使用して写真を撮る場合は正常に機能します)。さらに絞り込んで、ストック ブラウザのギャラリーから取得したデータの MIME タイプが利用できないことを確認しました (下の写真は、読み込まれているデータ URL の最初の 100 文字を示しています。目標は JPEG を強制することでした)。 , but without the MIME type we cannot know for sure how to fix this. 画像がどのようにレンダリングされるかについては、以下のコードを参照してください。

タイプなしでどのように画像をレンダリングできますか? いっそのこと、型が標準の Android ブラウザーで利用できない理由を誰か知っていますか?

編集

まず、これらは同じ画像ではありません。ほぼ同時に撮影されたものであり、それは問題ではありません。データが異なるのはそのためです (MIME タイプは、ストック ブラウザーのどの画像にも表示されないため、問題ではありません。 .

アップデート

MIME タイプが問題であることを確認し、イメージ/jpeg を chrome 上のストック ブラウザに挿入しました。残念ながら、それが jpeg になることを保証する方法がないため、実際にはそのようにすることはできません。

 _readInputFile: function (file, index) {
            var w = this, o = this.options;
            try {

                var fileReader = new FileReader();

                fileReader.onerror = function (event) {
                    alert(w._translate("There was a problem opening the selected file. For mobile devices, some files created by third-party applications (those that did not ship with the device) may not be standard and cannot be used."))
                    $('#loadingDots').remove();
                    return false;
                }
               fileReader.onload = function (event) {

                var data = event.target.result;
                //alert(data.substring(0,100));
                //var mimeType = data.split(":")[1].split(";")[0];


                alert("Load Image"); //I get to this point
                $('#' + w.disp.idPrefix + 'hiddenImages').append($('<img />', {
                    src: data,
                    id: "dummyImg" + index,
                    load: function(){
                    var width = dummy.width();
                    var height = dummy.height();
                    $('#dummyImg' + index).remove();
                    alert("Render"); // I don't get here
                        var resized = w._resizeAndRenderImage(data, null, null, biOSBugFixRequired, skewRatio, width, height);
                        alert("Image Rendered"); // I don't get here

                    }
                }));
            }
            fileReader.readAsDataURL(file);
        }
        catch (e) {
        }  
 } 

クロム
クロム

株式ブラウザ
株式ブラウザ

4

1 に答える 1

4

問題はおそらくブラウザ関連であり、ブラウザを実際に修正することはできないため (Google にバグを報告することはできます)、別の方法を取ることをお勧めします。

ここを見てください: Node.jsでは、URLが指定された場合、それがjpg/png/gifかどうかを確認するにはどうすればよいですか?

ファイルストリームを使用してファイルタイプを確認する方法を提案する、受け入れられた回答のコメントを参照してください。これは、Node.js だけでなく、ブラウザーに実装された Javascript でも機能すると確信しています。

于 2013-07-25T06:52:45.423 に答える