最近在用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插件拍照上传的时候,会传一个文件路径,如果你不保存到本地,上传的时候,插件就找不到文件,服务器就会收到一个空,附带的参数也会一并未空,原理就是这样。(再次骂街,耽误了这么长时间,用这玩意儿真是一个坑接一个坑,但是没办法,还得继续前行,欢迎交流)