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 相关文章推荐
jQuery源码中的chunker 正则过滤符分析
Jul 31 Javascript
一个Action如何调用两个不同的方法
May 22 Javascript
jQuery ajax时间差导致的变量赋值问题分析
Jan 22 Javascript
js实现前端分页页码管理
Jan 06 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
在element-ui的el-tree组件中用render函数生成el-button的实例代码
Nov 05 Javascript
判断文字超过2行添加展开按钮,未超过则不显示,溢出部分显示省略号
Apr 28 Javascript
基于JS实现一个随机生成验证码功能
May 29 Javascript
Vue+element 解决浏览器自动填充记住的账号密码问题
Jun 11 Javascript
js 实现 list转换成tree的方法示例(数组到树)
Aug 18 Javascript
js实现轮播图效果 纯js实现图片自动切换
Aug 09 Javascript
JavaScript使用setTimeout实现倒计时效果
Feb 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
CI框架入门示例之数据库取数据完整实现方法
2014/11/05 PHP
PHP 等比例缩放图片详解及实例代码
2016/09/18 PHP
PHP中字符与字节的区别及字符串与字节转换示例
2016/10/15 PHP
PHP实现百度人脸识别
2019/05/06 PHP
Aster vs KG BO3 第一场2.18
2021/03/10 DOTA
js给dropdownlist添加选项的小例子
2013/03/04 Javascript
js 利用image对象实现图片的预加载提高访问速度
2013/03/29 Javascript
JS简单实现文件上传实例代码(无需插件)
2013/11/15 Javascript
nodejs教程之环境安装及运行
2014/11/21 NodeJs
JS正则表达式比较常见用法
2016/01/26 Javascript
AngularJS数据源的多种获取方式汇总
2016/02/02 Javascript
JS实现的验证身份证及获取地区功能示例
2017/01/16 Javascript
JSON键值对序列化和反序列化解析
2017/01/24 Javascript
js 毫秒转天时分秒的实例
2017/11/17 Javascript
vue.js整合vux中的上拉加载下拉刷新实例教程
2018/01/09 Javascript
vue实现文件上传功能
2018/08/13 Javascript
快速解决vue在ios端下点击响应延时的问题
2018/08/27 Javascript
新手快速入门JavaScript装饰者模式与AOP
2019/06/24 Javascript
js实现表格数据搜索
2020/08/09 Javascript
python备份文件的脚本
2008/08/11 Python
Python 获得命令行参数的方法(推荐)
2018/01/24 Python
Django自定义manage命令实例代码
2018/02/11 Python
JavaScript实现一维数组转化为二维数组
2018/04/17 Python
python实战之实现excel读取、统计、写入的示例讲解
2018/05/02 Python
基于python 爬虫爬到含空格的url的处理方法
2018/05/11 Python
Python爬取数据保存为Json格式的代码示例
2019/04/09 Python
python实现视频压缩功能
2020/12/18 Python
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
2014/10/11 HTML / CSS
迪拜航空官方网站:flydubai
2017/04/20 全球购物
俄罗斯商务邀请函
2014/01/26 职场文书
农村党支部书记司法四风问题对照检查材料
2014/09/26 职场文书
六查六看自查报告
2014/10/14 职场文书
师德标兵事迹材料
2014/12/19 职场文书
顶岗实习协议书
2015/01/29 职场文书
2015年爱国卫生月活动总结
2015/03/26 职场文书
nginx负载功能+nfs服务器功能解析
2022/02/28 Servers