Plupload:如何直接从相机上传(在移动设备上)

hen*_*ght 7 javascript php wordpress file-upload plupload

我正在使用Plupload让用户将图像上传到我的WordPress网站.

当用户点击"选择文件"并从手机图库中选择图像时,图像的文件名将显示在屏幕上.然后,用户可以自由点击"上传文件"以开始上传.

我的问题

当用户点击"选择文件"并使用他们的照相手机拍照时,图像的文件名不会出现在屏幕上.在这种情况下,当用户现在尝试单击"上载文件"时,没有任何反应.我该如何解决这个问题?

笔记

当我使用平板电脑或台式机时,问题根本不会发生.

更新

我的测试是使用两个移动设备完成的:

  1. 运行Android 4.2.2的三星Galaxy S4 Mini上的Chrome
  2. 运行Android 4.1.2的三星Galaxy Ace II上的Chrome

这是我正在使用的代码的演示:http://jsfiddle.net/djydce90/

我的剧本

var uploader = new plupload.Uploader({
  runtimes : 'html5,flash,silverlight,html4',
  browse_button : 'pickfiles',
  container: document.getElementById( 'container' ),
  url : "/examples/upload",
  filters : {
    max_file_size : '10mb',
    mime_types: [
      {title : "Image files", extensions : "jpg,gif,png"},
      {title : "Zip files", extensions : "zip"}
    ]
  },
  flash_swf_url : '/plupload/js/Moxie.swf',
  silverlight_xap_url : '/plupload/js/Moxie.xap',
  init: {
    PostInit: function() {
      document.getElementById('filelist').innerHTML = '';

      document.getElementById('uploadfiles').onclick = function() {
        uploader.start();
        return false;
      };
    },
    FilesAdded: function(up, files) {
      plupload.each(files, function(file) {
        document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
      });
    },
    UploadProgress: function(up, file) {
      document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
    },
    Error: function(up, err) {
      document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message;
    }
  }
});

uploader.init();
Run Code Online (Sandbox Code Playgroud)

我的HTML

<script src="https://rawgit.com/moxiecode/plupload/master/js/plupload.full.min.js"></script>
<div id="filelist">Your browser doesn't have Flash, Silverlight or HTML5 support.</div>
<br />
<div id="container">
  <a id="pickfiles" href="javascript:;">[Select files]</a>
  <a id="uploadfiles" href="javascript:;">[Upload files]</a>
</div>
Run Code Online (Sandbox Code Playgroud)

参考: http ://www.plupload.com/examples/core

Onl*_*MAJ 1

问题来自于捕获图像的方法。当您拍照时,Android 会为您提供一个位图对象,因此您需要上传该位图而不是文件。当您从内存中选择一个文件时,它会向您发送该路径,但在捕获您时提供详细的照片数据。所以你需要上传照片数据而不是上传文件。我不知道 pluplaad 是否可以处理这个问题,但你可以通过此链接查看它。