Android照片上传切断图像？

我正在开发一个应用程序，允许用户通过

HTML

输入元素从智能手机上传照片。基本流程是，单击输入元素，选择相机，拍摄照片，然后在预览窗口中显示。当他们提交表单时，图像被

缩小到1200x900

，并且调整大小的图像的

base64 dataURL

被保存到

SQL

数据库中，因此我可以直接将其用作

如果我选择camera，然后保存它在预览窗口中正确显示的图像。预览是一个img元素，它的src设置为刚刚拍摄的缩小图片的dataURL。

一旦提交，如果我查看详细信息页面，我的所有相机图像都如下所示：

它们总是被突然切断，尽管其大小正确调整为
1200x900
。我想可能是dataURL太长了，所以我用我的桌面上传了一张11Mb的图片，它调整了大小并正确显示，所以它肯定与使用手机有关。降低相机的分辨率可以解决这个问题，但我需要尽可能高分辨率的源图像，然后再缩小它们（精确的工业工作）

上传时，相机照片通常约为
3Mb
。奇怪的是，它们正确地出现在预览窗口中，该窗口使用保存到数据库中的相同dataURL字符串

测试日期：

function picChange(evt) {
var fileInput = evt.target.files;
if (fileInput.length > 0) {
    var photoImg = document.getElementById("capturedPhoto");
    var photoData = document.getElementById("photoData");
    var filesizeSpan = document.getElementById("fileSizeinfo");

    var photo = evt.target.files[0];
    var reader = new FileReader();
    filesizeSpan.textContent = Math.round(photo.size * 0.000001) + 'Mb(s) - ' + Math.round(photo.size * 0.001) + 'kbs';

    reader.onload = function (theFile) {
        var img = new Image();
        img.onload = function () {

            var aspectRatio = img.width / img.height;
            var desiredWidth = 1200;
            var desiredHeight = desiredWidth / aspectRatio;

            var photoCanvas = document.createElement('canvas');
            photoCanvas.width = desiredWidth;
            photoCanvas.height = desiredHeight;

            var ctx = photoCanvas.getContext('2d');
            ctx.drawImage(img, 0, 0, desiredWidth, desiredHeight);

            var imageData = photoCanvas.toDataURL();
            photoImg.src = imageData;
            photoData.value = imageData; 
        }
        img.src = theFile.target.result;
    }
    var photoSrc = reader.readAsDataURL(photo);
}
}

原来答案是Chrome浏览器的问题。在android上，HTML文本框必须有某种字符限制，而PC上的IE11没有限制。我只需将提交URI的字段切换到TextArea字段，问题就消失了，不需要进行其他更改。
很难解决您的问题。如果您仅使用默认web浏览器进行测试，我建议您测试其他浏览器，包括Chrome mobile、Firefox。此外，其他不同操作系统版本的安卓手机也需要测试。例如，4.1.2（Jellybean）、4.4（Kitkat）或棒棒糖（5.0）。KitKat 4.4.2。我应该在问题中添加这一点。我认为你的问题是html而不是摄像头，因为你说相同的url在预览中正确显示，对吗？你是对的。在详细信息页面上，使用FancyBox显示上载的图像。然而，从我的桌面上传一个非常大的图像（11mb）并没有产生相同的截止图像，它工作得非常好。预览窗口使用与上载到数据库的图像相同的数据URL来显示图像。文件大小分辨率降低的捕获图像如何？这个问题是否只发生在3Mb左右？1,2,5Mb怎么样？
function picChange(evt) {
var fileInput = evt.target.files;
if (fileInput.length > 0) {
    var photoImg = document.getElementById("capturedPhoto");
    var photoData = document.getElementById("photoData");
    var filesizeSpan = document.getElementById("fileSizeinfo");

    var photo = evt.target.files[0];
    var reader = new FileReader();
    filesizeSpan.textContent = Math.round(photo.size * 0.000001) + 'Mb(s) - ' + Math.round(photo.size * 0.001) + 'kbs';

    reader.onload = function (theFile) {
        var img = new Image();
        img.onload = function () {

            var aspectRatio = img.width / img.height;
            var desiredWidth = 1200;
            var desiredHeight = desiredWidth / aspectRatio;

            var photoCanvas = document.createElement('canvas');
            photoCanvas.width = desiredWidth;
            photoCanvas.height = desiredHeight;

            var ctx = photoCanvas.getContext('2d');
            ctx.drawImage(img, 0, 0, desiredWidth, desiredHeight);

            var imageData = photoCanvas.toDataURL();
            photoImg.src = imageData;
            photoData.value = imageData; 
        }
        img.src = theFile.target.result;
    }
    var photoSrc = reader.readAsDataURL(photo);
}
}

Android KitKat 4.4.2
Android Web Browser & Chrome Mobile