Ajax清除浏览器js、css、图片缓存的方法


Posted in Javascript onAugust 06, 2015

做东东时都是把图片在服务器的地址存放在数据库里面,然后到浏览器中显示,但是后来发现了两个问题。

第一:为了安全起见,js是无法读取本地的图片的,不然你写一个js,岂不是可以获取任何人电脑里面的文件了。

第二:图片存在的是在服务器的硬盘上面,而不是在客户的硬盘里面,所以也是取不到的

后来在网上找方法,找的方法,都是各种转换二进制到xml中,的各种高大上的答案,然后本人又实在太懒了,就自己想了一个

方法,就是利用BufferedImage这个类。

开始

首先说说我的思路,就是把本地的图片,加载到内存中,然后放到BufferedImage这个缓冲流中,然后利用ImageIO.write(),这下大家都估计想得到一种思路了,但是如果说ajax,得到的数据,估计还是啥个乱七八糟的啥吧!没关系,稍后介绍。

工具类

首先建立一个加载图片的工类具,把一个图片的地址当参数存进去,得到这个图片的缓冲流:

/**
   * 根据图片的地址,返回图片的缓冲流
   * @param addr
   * @return
   */
  public static BufferedImage getInputStream(String addr){
    try {
      String imgPath = addr; 
      BufferedImage image = ImageIO.read(new FileInputStream(imgPath));
      return image;
    } catch (Exception e) {
      e.printStackTrace();
      System.out.println();
      System.out.println("获取图片异常:java.awt.image.BufferedImage");
      System.out.println("请检查图片路径是否正确,或者该地址是否为一个图片");
    }
    return null;
  }

没错,就是使用ImageIO.read,来加载流对象,然后就是处理类的代码了,这是我用的是springMVCspringMVC这段时间

比较火,所以我也好少用struts2了

处理类

/**
   * 根据图片的地址,来获取图片
   * @param addr
   * @param response
   */
  @ResponseBody
  @RequestMapping("/getImg")
  public void getImg(@Param("addr")String addr,HttpServletResponse response){
    BufferedImage img = new BufferedImage(300, 150, BufferedImage.TYPE_INT_RGB);
    img = ImgUtil.getInputStream(addr);
    if(img==null){
      throw new RuntimeException("打印图片异常:com.controller.Business_Ctrl.getImg(String, HttpServletResponse)");
    }
    if(img!=null){
      try {
        ImageIO.write(img, "JPEG", response.getOutputStream());
      } catch (IOException e) {
        e.printStackTrace();
        System.out.println("打印异常:com.controller.Business_Ctrl.getImg(String, HttpServletResponse)");
      }
    }
  }

很明显,使用ImageIO.read()读到图片时,就用ImageIO.write(),输出图片,输入流就是

HttpServletResponse.getOutputStream()

客户端

 

 function setImg(addr){



 

                $("#logo").attr("src","business/getImg?addr="+addr+"");

            }

如图所示,当需要加载图片的时候,就触发setImg方法,给它一个地址,当然,地址,早已经从后台传到前台了,自然,就算没有地址,稍微变一下,也可以在后台得到地址,然后返回,然后给img标签设置src属性,就可以得到图片了。

下面介绍下jquery1.2版本运用Ajax清除浏览器js、css、图片缓存的方法。

jquery自从1.2开始就有ifModified和cache参数了,不用自己加header

ifModified Boolean Default: false 
Allow the request to be successful only if the response has changed since the last request. This is done by checking the Last-Modified header. Default value is false, ignoring the header. 
cache Boolean Default: true 
Added in jQuery 1.2, if set to false it will force the pages that you request to not be cached by the browser. 
$.ajax({
type: "GET",
url: "static/cache.js",
dataType: "text",
cache:false,
ifModified :true
});
Javascript 相关文章推荐
js跳转页面方法实现汇总
Feb 11 Javascript
实现无刷新联动例子汇总
May 20 Javascript
js+css实现超简洁的二级下拉菜单效果代码
Sep 07 Javascript
AngularJS基础 ng-open 指令简单实例
Aug 02 Javascript
node.js中 stream使用教程
Aug 28 Javascript
基于JavaScript实现移动端无限加载分页
Mar 27 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
May 05 Javascript
vuejs 切换导航条高亮(路由菜单高亮)的方法示例
May 29 Javascript
Vue Autocomplete 自动完成功能简单示例
May 25 Javascript
微信小程序JS加载esmap地图的实例详解
Sep 04 Javascript
ionic2.0双击返回键退出应用
Sep 17 Javascript
JS实现滚动条触底加载更多
Sep 19 Javascript
jQuery实现动画效果circle实例
Aug 06 #Javascript
jQuery动态星级评分效果实现方法
Aug 06 #Javascript
javascript使用输出语句实现网页特效代码
Aug 06 #Javascript
JS实现霓虹灯文字效果的方法
Aug 06 #Javascript
javascript实现网页背景烟花效果的方法
Aug 06 #Javascript
JS实现三级折叠菜单特效,其它级可自动收缩
Aug 06 #Javascript
JavaScript实现定时隐藏与显示图片的方法
Aug 06 #Javascript
You might like
利用PHP实现图片等比例放大和缩小的方法详解
2013/06/06 PHP
Zend Framework动作助手(Zend_Controller_Action_Helper)用法详解
2016/03/05 PHP
php实现转换html格式为文本格式的方法
2016/05/16 PHP
详细解读php的命名空间(二)
2018/02/21 PHP
php快速导入大量数据的实例方法
2019/09/23 PHP
setTimeout 不断吐食CPU的问题分析
2009/04/01 Javascript
一步一步教你写一个jQuery的插件教程(Plugin)
2009/09/03 Javascript
jQuery 第二课 操作包装集元素代码
2010/03/14 Javascript
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
2013/04/27 Javascript
jquery text()方法取标签中的文本
2014/07/25 Javascript
详解javascript new的运行机制
2016/01/26 Javascript
javascript嵌套函数和在函数内调用外部函数的区别分析
2016/01/31 Javascript
Javascript实现的SHA-256加密算法完整实例
2016/02/02 Javascript
JQuery EasyUI的使用
2016/02/24 Javascript
实现JavaScript的组成----BOM和DOM详解
2016/05/18 Javascript
Angular2中Bootstrap界面库ng-bootstrap详解
2016/10/18 Javascript
解决微信二次分享不显示摘要和图片的问题
2017/08/18 Javascript
vue下跨域设置的相关介绍
2017/08/26 Javascript
Vue 兄弟组件通信的方法(不使用Vuex)
2017/10/26 Javascript
react-native fetch的具体使用方法
2017/11/01 Javascript
解决Vue 通过下表修改数组,页面不渲染的问题
2018/03/08 Javascript
浅析vue cli3 封装Svgicon组件正确姿势(推荐)
2020/04/27 Javascript
javascript的hashCode函数实现代码小结
2020/08/11 Javascript
python基础教程之缩进介绍
2014/08/29 Python
pandas中Timestamp类用法详解
2017/12/11 Python
python使用Tesseract库识别验证
2018/03/21 Python
Python3爬虫学习之爬虫利器Beautiful Soup用法分析
2018/12/12 Python
pytorch 获取层权重,对特定层注入hook, 提取中间层输出的方法
2019/08/17 Python
python中删除某个元素的方法解析
2019/11/05 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
Python pip 常用命令汇总
2020/10/19 Python
使用Python实现音频双通道分离
2020/12/25 Python
马耳他航空公司官方网站:Air Malta
2019/05/15 全球购物
2015年仓库管理员工作总结
2015/04/21 职场文书
《玩出了名堂》教学反思
2016/02/17 职场文书
JavaScript组合继承详解
2021/11/07 Javascript