关于$cordovaFileTransfer上传文件和参数遇到的坑

最近在用ionic开发项目,其中涉及到拍照上传文件,按照官方的说法,需要配置一个option,如下:

   var options = {
      quality: 50,
      destinationType: Camera.DestinationType.DATA_URL,
      sourceType: Camera.PictureSourceType.CAMERA,
      allowEdit: true,
      encodingType: Camera.EncodingType.JPEG,
      targetWidth: 100,
      targetHeight: 100,
      popoverOptions: CameraPopoverOptions,
      saveToPhotoAlbum: false,
      correctOrientation:true
    };

然后调用

$cordovaCamera.getPicture(cameraOptions).then(function (imageData) {
          //var image = document.getElementById('myImage');
          //image.src = "data:image/jpeg;base64," + imageData;
          $scope.imgData = imageData;
          console.log(imageData);
        }, function (err) {
          // error
        });

就可以了,然后用

var options = new FileUploadOptions();
 var params = {
   facilityIdentify: '217ae60e5bc746f',
   cyberkeyCode: 'AQOhlmsQAAKgCoi',
   tenantId: 1
 };
 options.params = params;

$cordovaFileTransfer.upload(encodeURI(url), $scope.imgData, options)
          .then(function (result) {
            console.log(JSON.stringify(result.response));
            console.log("success");
          }, function (err) {
            console.log(JSON.stringify(err));
            console.log("fail");
          }, function (progress) {
            // constant progress updates
          });

进行上传,这里后台用到的是springboot

    @CrossOrigin(origins = "*")
    @RequestMapping(value = "/st", method = RequestMethod.POST)
    public String saveTracingDetais(String cyberkeyCode,String facilityIdentify, String tenantId, MultipartFile[] file ) {
        System.out.println(cyberkeyCode);
        return "123";
    }

上传文件的时候,可以带一些参数,理论上,这样就行了。
但是,你会发现,后台就是不能接收到文件和参数,不管怎样都为空(此处想骂街,因为一个参数的缘故,耽误了一个下午加一个晚上),之前的option是从官网copy下来的,就是不行,先把正确的option给出来,如下

  var cameraOptions = {
        quality: 100,                                            //相片质量0-100
        destinationType: Camera.DestinationType.FILE_URI,        //返回类型:DATA_URL= 0,返回作为 base64 編碼字串。 FILE_URI=1,返回影像档的 URI。NATIVE_URI=2,返回图像本机URI (例如,資產庫)
        sourceType: Camera.PictureSourceType.CAMERA,             //从哪里选择图片:PHOTOLIBRARY=0,相机拍照=1,SAVEDPHOTOALBUM=2。0和1其实都是本地图库
        allowEdit: false,                                        //在选择之前允许修改截图
        encodingType: Camera.EncodingType.JPEG,                   //保存的图片格式: JPEG = 0, PNG = 1
        targetWidth: 200,                                        //照片宽度
        targetHeight: 200,                                       //照片高度
        mediaType: 0,                                             //可选媒体类型:圖片=0,只允许选择图片將返回指定DestinationType的参数。 視頻格式=1,允许选择视频,最终返回 FILE_URI。ALLMEDIA= 2,允许所有媒体类型的选择。
        cameraDirection: 0,                                       //枪后摄像头类型:Back= 0,Front-facing = 1
        popoverOptions: CameraPopoverOptions,
        saveToPhotoAlbum: true
      };

看吧,区别并不大,但是有一个参数saveToPhotoAlbum,我猜测就是这玩意儿导致的,这个参数的意思是拍照之后将图像保存到相册,如果为false,就不保存。如果你写的false,恭喜你,掉坑里了。cordova插件拍照上传的时候,会传一个文件路径,如果你不保存到本地,上传的时候,插件就找不到文件,服务器就会收到一个空,附带的参数也会一并未空,原理就是这样。(再次骂街,耽误了这么长时间,用这玩意儿真是一个坑接一个坑,但是没办法,还得继续前行,欢迎交流)

你可能感兴趣的:(hybird开发,web前端)