方法一:
function iCache(selector) {
selector.each(function(data) {
//msg(data);
! function(data) {
var url = selector.eq(data).attr("src");
var img = this;
var filename = GetFileName(url);
var path = "cache://" + filename;
var obj = api.require('fs');
obj.exist({
path : path
}, function(ret, err) {
//msg(ret);
if (ret.exist) {
if (ret.directory) {
//api.alert({msg:'该路径指向一个文件夹'});
} else {
//api.alert({msg:'该路径指向一个文件'});
//selector.eq(data).src=path;
selector.eq(data).attr('src', null);
path = api.cacheDir + '/' + filename;
selector.eq(data).attr('src', path);
//console.log(selector.eq(data).attr("src"));
}
} else {
api.download({
url : url,
savePath : path,
report : false,
cache : true,
allowResume : true
}, function(ret, err) {
//msg(ret);
if (ret) {
var value = ('文件大小:' + ret.fileSize + ';下载进度:' + ret.percent + ';下载状态' + ret.state + '存储路径: ' + ret.savePath);
} else {
var value = err.msg;
};
});
}
});
}(data);
});
};

1.定义使用标签<img src="http://域名/aaa.jpg" class="cache">,比如
<body>
<ul>
<li><img src="http://域名/a.jpg" class="cache"></li>
<li><img src="http://域名/ab.jpg" class="cache"></li>
<li><img src="http://域名/aab.jpg" class="cache"></li>
<li><img src="http://域名/aaab.jpg" class="cache"></li>
</ul>
</body>
//此处是引用的库文件,api.js,zepto.js等
<script     XXXXX  >
<script>
  function iCache(){
  //上面的定义
}
apiready=function(){
//(1)初始化工作

//2获取数据

//3封装页面

//4过滤页面链接

iCache($('.cache'));
}

</script>

2.引入zepto.js

3.利用dom.js等模板库或者封装字符串做好页面元素布局

4.iCache($('.chache'))调用即可

效果,第一次是使用网络路径,之后即可缓存到本地,后面打开就不会去访问网络地址了。

二:使用apicloud的 imgcache方法

图片

<img onload="imageCache(this)" data-url="{{=value.img_url}}" class="thumbnail" src="../image/zd.png">
  • 图片src必须为存在的图片,否则不会启用

    imageCache

    方法

//列表图片缓存
function imageCache(ele_){
var imageURL = $api.attr(ele_, 'data-url');
api.imageCache({
url: imageURL
}, function(ret, err){
if(ret.status){
ele_.src = ret.url;
$api.removeAttr(ele_, 'data-url');
}
});
}

简答说,就是不直接设置src图片属性,而是交给imageCache,imageCache内部的处理逻辑应该是如果本地有,就直接返回本地地址,如果本地没有,就下载后返回本地地址(YY); 图片路径用 data-url 表示不直接用使用 src

apicloud 人脸识别登录

http://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=14931

img标签过滤加fs模块实现图片文件缓存的更多相关文章

  1. nodejs模块——fs模块 WriteFile写入文件

    WriteFile写入文件 使用fs.writeFile(filename,data,[options],callback)写入内容到文件. 参数说明: filename String 文件名 dat ...

  2. 使用.htaccess进行浏览器图片文件缓存

    对于图片类网站,每次打开页面都要重新下载图片,慢不说,还非常浪费流量.这时就需要用到缓存,强制浏览器缓存图片文件 缓存文件,提问网站访问数度,减少流量消耗,现提供2中缓存代码 打开.htaccess文 ...

  3. ssh整合问题总结--在添加商品模块实现图片(文件)的上传

    今天在做毕设(基于SSH的网上商城项目)中碰到了一个文件上传的需求,就是在后台管理员的商品模块中,有一个添加商品,需要将磁盘上的图片上传到tomcat保存图片的指定目录中: 完成这个功能需要两个步,第 ...

  4. 为什么Android应该根据屏幕分辨率来加载不同的图片文件

    1.图片在xxhdpi,手机是hdpi的 我们有一个手机是hdpi的.我们还有一个图片,我们把他放在xxhdpi下.当手机显示的时候,系统会去hdpi中找,发现没有图片,最终在xxhpi中找到.终于找 ...

  5. Javascript 的模块化编程及加载模块【转载+整理】

    http://www.ruanyifeng.com/blog/2012/10/javascript_module.html 本文内容 引入 模块化 最初写法 对象写法 立即执行函数写法 放大模式 宽放 ...

  6. Android ListView 图片异步加载和图片内存缓存

    开发Android应用经常需要处理图片的加载问题.因为图片一般都是存放在服务器端,需要联网去加载,而这又是一个比较耗时的过程,所以Android中都是通过开启一个异步线程去加载.为了增加用户体验,给用 ...

  7. node的fs模块使用————node

    node的fs模块使用----node fs模块是调用文件的模块. var fs=require('fs'); //引用模块. //查看文件信息 fs.stat('index.txt',functio ...

  8. Node.js学习(1)-加载模块require('fs/http/.b/art-template')

    node.js既不是语言,也不是框架,它是一个平台 加载模块: 核心模块(require('fs/http')), 自定义模块(var bExport=require('./b'),exports.f ...

  9. 火车头dede采集接口,图片加水印,远程图片本地化,远程无后缀的无图片本地化

    <?php /* [LocoySpider] (C)2005-2010 Lewell Inc. 火车采集器 DedeCMS 5.7 UTF8 文章发布接口 Update content: 图片加 ...

随机推荐

  1. IDEA返回上一步

    在开发中进入一个方法后想要到原来那行 ctrl+alt+左 回到上一步 ctrl+alt+右 回到下一步

  2. linux -- 扩容 /home 空间( xfs文件系统分区扩容指定挂载点)

    问题: /home空间容量不够使用,扩容卷组,扩容挂载点 方法: 1. 确认有可用的物理磁盘 fdisk -l -- 查看磁盘信息 df -h -- 查看当前挂载信息 vgs -- 查看当前卷组信息 ...

  3. 3.IDEA+Maven+Spring注解+Servlet+MyBatis

    1.创建项目模块 2. 选择创建的项目类型,maven的web项目 3.输入项目名 4.选择自己配置的本地maven库 5.创建项目 6.查看项目结构 7.配置项目的依赖pom.xml <?xm ...

  4. jQuery动态效果

    1.一号店首页 2.淘宝网购物车

  5. mysql 数据库上传限制

  6. JAVA接口的简单实现

    感觉越来越强烈, 我的心在跳~~~,我的宝剑在嘟~~ Flyer.java package cc.openhome; public interface Flyer{ public abstract v ...

  7. ZEAL--可以查看所有软件API的软件

    windows平台上最强大的可以查看所有API的软件,从此再也不用去各个网站上扒了,而且有时还有Greate Wall 点我下载

  8. 洛谷 P2728 纺车的轮子 Spinning Wheels

    P2728 纺车的轮子 Spinning Wheels 题目背景 一架纺车有五个纺轮(也就是五个同心圆),这五个不透明的轮子边缘上都有一些缺口.这些缺口必须被迅速而准确地排列好.每个轮子都有一个起始标 ...

  9. 4443: [Scoi2015]小秃玩矩阵|二分答案|匈牙利

    第K大看成第K小各种WA. .. 第K大也就是第n−K+1小.所以就能够愉快的二分答案了 二分答案找出比当前答案小的数的位置的坐标.推断一下能否够选出满足不在同一行同一列的n−K+1个数,然后就能够愉 ...

  10. 怎样又一次编译linux内核

    linux作为自由软件.在广大爱好者的支持下,内核版本号不断更新. 新的内核修订了就得内核的bug,并添加了很多新的特性.假设用户须要使用这些新的特性或者依据自己的系统量身定做一个更高效或更稳定的内核 ...