mui图片上传PHP,Vue+mui实现图片的本地缓存示例代码

下面一段代码给大家分享基于Vue+mui实现图片的本地缓存,具体代码如下所示:

md5

// 缓存目录 _downloads/image/(md5).jpg

let image_url = imgObj.image;

let image_md5 = md5(image_url);

// 缓存本地图片url

let local_image_url = '_downloads/image/'+image_md5+'.jpg';

// 平台绝对路径

let absolute_image_path = plus.io.convertLocalFileSystemURL(local_image_url);

console.log(absolute_image_path);

// 判断本地是否存在该文件,存在就就直接使用,否则就下载

plus.io.resolveLocalFileSystemURL( absolute_image_path,function( entry ) {

if(entry){

imgObj.image = plus.io.convertLocalFileSystemURL(local_image_url);

}else{

download_img();

}

},function ( e ) {

console.log("Resolve file URL Failed: ");

download_img();

} );

function download_img(){

// filename:下载任务在本地保存的文件路径

let download_task = plus.downloader.createDownload(image_url,{

filename: local_image_url

},function(download,status) {

// 下载失败,删除本地临时文件

if(status != 200){

console.log('下载失败,status'+status);

if(local_image_url != null){

plus.io.resolveLocalFileSystemURL(local_image_url,function(entry) {

entry.remove(function(entry) {

console.log("临时文件删除成功" + local_image_url);

// 重新下载图片

download_img();

},function(e) {

console.log("临时文件删除失败" + local_image_url);

});

});

}

}else{

// 把下载成功的图片显示

// 将本地URL路径转换成平台绝对路径

console.log("下载成功" + local_image_url);

imgObj.image = plus.io.convertLocalFileSystemURL(local_image_url);

}

});

download_task.start();

}

});

}

},actions: {

}

}

总结

以上所述是小编给大家介绍的Vue+mui实现图片的本地缓存示例代码。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。

总结

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值