Question

是否有人能够指出我正确的方向，我试图为网站编写一个小应用程序，用户可以在其中选择图像，或选择使用他们的图像捕获图像手机相机。

然后我们可以向他们显示（预览）图像，他们可以确认并继续，或重新启动并再次拍摄图像。

我已经找到了一些方法来使用jQuery，这似乎在计算机上运行良好，但在手机上（使用运行最新chrome的Samsung S5测试）我经常收到错误消息，说明由于内存不足，无法完成上一个操作。

以下是我使用的当前代码的一个示例，这只是为了显示一个基本示例而被删除，但您可以看到该方法看起来效率不高：

$(function() {
$("#prev-img-file").on("change", function()
{
    var files = !!this.files ? this.files : [];
    if (!files.length || !window.FileReader) return; // no file selected, or no FileReader support

    if (/^image/.test( files[0].type)){ // only image file
        var reader = new FileReader(); // instance of the FileReader
        reader.readAsDataURL(files[0]); // read the local file

        reader.onloadend = function(){ // set image data as background of div
            $(".up-pic-preview").css("background-image", "url("+this.result+")");

        }
    }
});
});

http://jsfiddle.net/fish_r/vnu7661c/

有人知道任何不会占用太多资源的东西吗？

谢谢！

Answer 1

试试WebcamJS。

One of the demo pages - 在我的android 4.4手机上测试一分钟前 - 工作正常： - ）

此库允许您：

显示预览;
捕捉图片;
将捕获的图像上传到服务器;
如果不支持HTML5 getUserMedia（），则回退到flash;

在上传之前从移动相机捕获图像并预览

1 个答案: