Phonegap Vue js Android将CAMERA图像上传到API服务器

Posted 2023-04-17

【中文标题】Phonegap Vue js Android将CAMERA图像上传到API服务器

【英文标题】：Phonegap Vue js Android uploading CAMERA image to API server

【发布时间】：2018-02-16 05:32:49

【问题描述】：

我正在尝试上传由 android 相机 (cordova-plugin-camera) 拍摄的照片。我的代码是

takePicture () 
  navigator.camera.getPicture(result => 
    this.newUnit.addedPic = true
    this.newUnit.image = result
  , error => 
    alert(error);
  ,
  
    sourceType : Camera.PictureSourceType.CAMERA,
    destinationType: Camera.DestinationType.FILE_URI,
    encodingType: Camera.EncodingType.JPEG,
  );
,

在我的 this.newUnit.addedPic 中，我得到了如下路径：

file:///storage/emulated/0/Android/data/.../1234.jpg

如何使用它从移动应用程序将图片上传到服务器？ 在我的 Web 部件中，我使用 FormData 来上传图片。

我试图通过 FileTransfer 执行此操作，但收到错误代码 1：

let win = r => alert(`win`)
    let fail = error => 
      alert("An error has occurred: Code = " + error.code);
      console.log("upload error source " + error.source);
      console.log("upload error target " + error.target);
    
    var options = new FileUploadOptions();
    options.fileKey = "file";
    options.fileName = this.newUnit.image.substr(this.newUnit.image.lastIndexOf('/') + 1);
    options.mimeType = "image/jpeg";

    var params = ;
    params.name = "test";
    params.creator = 3;

    options.params = params;

    var ft = new FileTransfer();
    ft.upload(this.newUnit.image, encodeURI("http://myserver/api/v0/units/"), win, fail, options);

【参考方案1】：

已解决。问题是由于空标题和 http 方法。

  var headers =  'Authorization':`Token $token` ;
  options.headers = headers;

  options.httpMethod= "POST";
  options.chunkedMode = true;`