3

使用PhoneGap的相机和文件API我正在尝试制作它，以便当我在某个应用程序中拍照时，它会自动上传到我正在使用的服务器。

我已将这两个 API 复制到我的 index.html 文件中，我唯一更改的是在 onPhotoDataSuccess 块中添加另一个设置为等于 ImageData 的 javascript 变量 imageInfo。当我调用它时，这个 imageInfo 然后被设置为uploadPhoto 的参数。

我唯一改变的另一件事是放行： navigator.camera.DestinationType(1);这样输出就是imageURI需要uploadPhoto的。

我在 HTML 中的唯一代码是：

button onclick="capturePhoto(); uploadPhoto(imageData);">Capture Photo</button (in brackets of course)

但由于某种原因，它不起作用。您在我的推理中看到的任何提示或缺陷？

谢谢！

4

3 回答 3

4

看看FileTransfer API将允许您将图像直接上传到文件服务器。（假设您使用的是最新的 Phonegap）

这正是你想要的。源代码取自 Phonegap 的文档：

// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is ready
function onDeviceReady() {
  // Retrieve image file location from specified source
  navigator.camera.getPicture(uploadPhoto,
  function(message) { alert('get picture failed'); },
    { quality: 50, 
      destinationType: navigator.camera.DestinationType.FILE_URI,
    sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY }
    );
  }
  function uploadPhoto(imageURI) {
    var options = new FileUploadOptions();
    options.fileKey="file";
    options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1);
    options.mimeType="image/jpeg";
    var params = new Object();
    params.value1 = "test";
    params.value2 = "param";
    options.params = params;
    var ft = new FileTransfer();
    ft.upload(imageURI, "http://some.server.com/upload.php", win, fail, options);
  }
  function win(r) {
    console.log("Code = " + r.responseCode);
    console.log("Response = " + r.response);
    console.log("Sent = " + r.bytesSent);
  }
  function fail(error) {
    alert("An error has occurred: Code = " = error.code);
  }
于 2012-05-24T05:56:11.487 回答
2

既然Camera是事件驱动的，就不能一味地把事件串起来，寄希望于最好的结果……在success拍照代码的回调中，你必须调用然后上传图片的代码。

编辑

这里我使用的是成功绘制图像时返回的 URI。但这应该很简单。

function takePicture() {
  loadPhotoIntake();
  navigator.camera.getPicture(
    setPicture,
    function(e) {
      console.log("Error getting picture: " + e);
      document.getElementById('camera_status').innerHTML = "Error getting picture.";
    },
    { quality: 70, destinationType: navigator.camera.DestinationType.FILE_URI});
};


function setPicture(uri) {
  var c=document.getElementById('camera_image');
  var ctx = c.getContext('2d');
  var img = new Image();
  var canvasCopy = document.createElement("canvas");
  var copyContext = canvasCopy.getContext("2d");
  var maxWidth, maxHeight;
  img.onload = function(){
    // resizing code
      .....
    // draw
    ctx.drawImage(canvasCopy, 0, 0, camera_image.width, camera_image.height);
  };
  img.src = uri;
}
于 2012-05-24T00:47:28.543 回答
-1

看起来您可以camera.getPicture(...)从 PhoneGap API 使用。这将启动默认的相机应用程序，让用户拍照，完成后它将返回 base64 编码字符串的数据，或者它会给你图像文件的 uri。然后，您应该能够使用它上传到服务器。您可以在此处camera.getPicture找到的文档中了解更多信息。从那篇文章来看，这似乎很简单。

我从来没有使用过PhoneGap，我在2分钟内找到了这个。

于 2012-05-23T23:55:26.777 回答