web前端:前端如何保存页面图片,并在相册中查看?
编程小助手
2024-04-23 23:12
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展,HTML5,CSS3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完美的动效设计,给用户带来极高的用户体验。
第一次接触混合开发,然后碰到了很多H5+api,调用手机相册,扫码,保存图片等。做技术的注定了要终生学习,但学无止境,我们不可能把所有的知识技能都学完了,学精通了再去工作,我们需要在工作中去提升自己,在工作红去总结去成长。
我项目是用mui加H5+去开发的,所以在调用H5+的api时要等plusready事件发生后才能正常使用。
mui.plusReady(function(){
//在这里面写你所调用的api
plus.downloader.createDownload(url,options,completedCB);
//url:必选,要下载文件的url地址,仅支持网络资源地址,支持http或https协议
//option:可选
//completedCB:可选,下载完成时触发,不管成功或者失败都会触发此回调
completedCB(download,status){}
//download:必选,下载任务对象
//status:必选,下载结果状态码,下载成功status=200
//以上保存图片成功但是并未保存到图库
plus.gallery.save(path,successCB,errorCB);此方法将图片保存到图库
//path:必选,保存到相册中的文件地址
//successCB:必选,保存成功后的回调
//errorCB:可选,保存失败后的回调
});
//以上是一个简短的文档,如果需要详细的了解学习,请看H5+api,点击即可www.html5plus.org/doc/h5p.html
//以下为完整代码
mui.plusReady(function(){
plus.downloader.createDownload(url,{},function(download,status){
if(status=200){
plus.gallery.save(download.filename,function(){
plus.nativeUI.toast("保存成功");
},function(){
plus.nativeUI.toast("保存失败");
});
}else{
plus.nativeUI.toast("下载失败");
}
});
});
一般这两个方法结合使用,我的理解是创建一个下载任务,将网络地址图片下载到本地,然后利用plus.gallery.sava()方法将保存到手机系统文件夹里面的图片复制粘贴到手机图库,方便查看。
一个来自刚进入前端小白的工作总结,不喜勿喷,如有不对的地方还请指出!
前端技术一般分为前端设计和前端开发,前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基本的HTML和CSS以及Javascript/ajax,现在最新的高级版本HTML5、CSS3,以及SVG等。
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341