Vue+mui实现图片的本地缓存示例代码
发布时间：2020-12-17 03:09:08 所属栏目：百科 来源：网络整理
导读：下面一段代码给大家分享基于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/'+i
|
下面一段代码给大家分享基于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实现图片的本地缓存示例代码。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |