图片压缩上传参数设置

1.使用拍照上传
function takePhoto(){
var photonum = jQuery('#photonum').val();
if(isNotNull(photonum) && photonum >=9){
mui.alert('最多选择9张照片');
}else{
var cmr = plus.camera.getCamera();
cmr.captureImage( function ( p ) {
plus.io.resolveLocalFileSystemURL( p, function ( entry ) {
createItem( entry );
}, function ( e ) {
} );
}, function ( e ) {
}, {filename:"_doc/camera/",index:1} );
}
}
function createItem( entry ) {
compressImage(entry.toLocalURL(),'20');
}
//压缩图片,并拼接显示
function compressImage(path,qa){
var parent_file_path = path.substring(0,path.lastIndexOf('/')+1);
var file_name = path.substring(path.lastIndexOf('/')+1,path.length);
var file_pure_name = file_name.substring(0,file_name.indexOf('.'));
var file_type = file_name.substring(file_name.indexOf('.'));
var random_num = createRandomNumber();
var file_compress_name = parent_file_path+random_num+file_type ;
plus.zip.compressImage({
src:path,
dst:file_compress_name,//为了不和原来的路径重复,给dst参数设置另外的保存路径
quality:qa,
overwrite:true
},
function() {
var appendPicHtml = '';
appendPicHtml+='<li class="per33 fl tc ht96 pt8 mb6">';
appendPicHtml+='<div class="display-ib l-ht0 overflow-h per95 tc ht96">';
appendPicHtml+='<img style="transform: scale(2);-webkit-transform: scale(2);" class="per100 vertical-a-m uploadimg" src="'+file_compress_name+'" />';
appendPicHtml+='</div>';
appendPicHtml+='</li>';
jQuery('#picUl').prepend(appendPicHtml);
var photonum = jQuery('#photonum').val();
if(isNotNull(photonum)){
photonum = parseInt(photonum)+1;
}else{
photonum = 1;
}
jQuery('#photonum').val(photonum);
if(photonum >= 9 ){
jQuery('#uploadPic').hide();
}

    },function(error) {  
});  

}
这样是没有问题.
2.但是如果从相册选择多张图片时
// 从相册中选择图片
plus.gallery.pick( function(e){
var appendPicHtml = '';
var last_length = 0 ;
var curr_length = e.files.length ;
var curr_all_num = parseInt(curr_length) + parseInt(already_photo_length) ;
if(curr_all_num <= 9){
last_length = e.files.length ;
}else{
last_length = 9-already_photo_length ;
}
if(curr_all_num >= 9){
jQuery('#uploadPic').hide();
}
compressImageForChoosePic(e,last_length,'20',curr_all_num);
}, function ( e ) {
},{filter:"image",multiple:true,maximum:9,system:false,onmaxed:function(){
plus.nativeUI.alert('最多只能选择9张图片');
}});
把选择到的图片集传入到compressImageForChoosePic()方法中.首先我是这样处理,在成功回调函数中把压缩之后的产生的新文件拼接到html片段中
function compressImageForChoosePic(e,last_length,qa,curr_all_num){
var appendPicHtml = '';
for(var i =0;i<last_length;i++){
var path = e.files[i];
var parent_file_path = path.substring(0,path.lastIndexOf('/')+1);
var file_name = path.substring(path.lastIndexOf('/')+1,path.length);
var file_pure_name = file_name.substring(0,file_name.indexOf('.'));
var file_type = file_name.substring(file_name.indexOf('.'));
var random_num = createRandomNumber();
var file_compress_name = parent_file_path+random_num+file_type ;
plus.zip.compressImage({
src:path,
dst:file_compress_name,
quality:qa,
overwrite:true
},
function() {
appendPicHtml+='<li class="per33 fl tc ht96 pt8 mb6">';
appendPicHtml+='<div class="display-ib l-ht0 overflow-h per95 tc ht96">';
appendPicHtml+='<img style="transform: scale(2);-webkit-transform: scale(2);" class="per100 vertical-a-m uploadimg" src="'+file_compress_name+'" />';
appendPicHtml+='</div>';
appendPicHtml+='</li>';
},function(error) {
});
}
console.log(appendPicHtml);
jQuery('#picUl').prepend(appendPicHtml);
jQuery('#photonum').val(curr_all_num);
}
// 这样按照正常的逻辑来看,应该是得到多个li组成的html片段,每个li的img src不同,但是结果是不论怎么试,返回的 file_compress_name 一直都是最后一个,不会改变.
后来我考虑把每次产生的 file_compress_name 保存在数组中,压缩完成后来循环数组来获取压缩的结果路径.
这样实现:
function compressImageForChoosePic(e,last_length,qa,curr_all_num){
var picCompressPathChooseFromDCIM = new Array() ;
for(var i =0;i<last_length;i++){
var path = e.files[i];
var parent_file_path = path.substring(0,path.lastIndexOf('/')+1);
var file_name = path.substring(path.lastIndexOf('/')+1,path.length);
var file_pure_name = file_name.substring(0,file_name.indexOf('.'));
var file_type = file_name.substring(file_name.indexOf('.'));
var random_num = createRandomNumber();
var file_compress_name = parent_file_path+random_num+file_type ;
plus.zip.compressImage({
src:path,
dst:path,
quality:qa,
overwrite:true
},
function() {
picCompressPathChooseFromDCIM.push(path);
},function(error) {
});
}
// setTimeout(function (){
// for(var k=0;k<e.files.length;k++){
// console.log(e.files[k]+'数组');
// }
// },5000);
var appendPicHtml = '';
// setTimeout(function (){
for(var k =0 ;k<picCompressPathChooseFromDCIM.length;k++){
appendPicHtml+='<li class="per33 fl tc ht96 pt8 mb6">';
appendPicHtml+='<div class="display-ib l-ht0 overflow-h per95 tc ht96">';
appendPicHtml+='<img style="transform: scale(2);-webkit-transform: scale(2);" class="per100 vertical-a-m uploadimg" src="'+picCompressPathChooseFromDCIM[k]+'" />';
appendPicHtml+='</div>';
appendPicHtml+='</li>';
}
// },5000);
console.log(appendPicHtml);
jQuery('#picUl').prepend(appendPicHtml);
jQuery('#photonum').val(curr_all_num);
}
然并卵,后来发现不管怎么调,根本就不会进到 picCompressPathChooseFromDCIM 的循环中,后来发现是js异步执行.上边循环压缩的过程还没有完成,
下边从 picCompressPathChooseFromDCIM 中循环取值的逻辑已经开始.所以取不到,好,加了一个延迟执行,setTimeout 5s 以后执行.暂且不管合不合理,
现在是可以从 picCompressPathChooseFromDCIM 中取到值了,但是,打出来之后发现,还是完全一样的路径,应该还是最后一个压缩图片的途径.
说明一下,要改变图片压缩之后的路径的原因:1>,为了避免压缩之后的图片对之前的原图片进行覆盖.2>,有些类型截屏之类的图片名字中包含有文字,
放到li的img src之后没有问题,但是后来使用 jQuery.each()来获取的时候,默认是经过了encode编码,所以上传的时候,压缩之后路径和压缩之前的从字面
来看字符串是不相同的,所以造成,选择之后可以在拼接的页面中显示,但是不能上传,因为找不到该图片.
3.没招了,就不再修改压缩路径,但是图片中文名字还得解决,在从each中获取的时候,直接使用decodeURL来解码,就可以了.
但是压缩还是得做,就用了相同的路径,即:
plus.zip.compressImage({
src:path,
dst:file_compress_name,
quality:qa,
overwrite:true
},
中的 src:和dst:相同.

问题:1.为什么从相册中选择多张图片之后,得到的压缩路径最终会是一个?
2.我现在使用的是源路径和目标路径相同,这样,压缩之后,是否会将源图片文件给覆盖?我尝试过修改 overwrite 属性值为:false,好像不成功,会报错.

求解答.