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实现页面打印功能实例代码(附去页眉页脚功能代码)
Dec 15 Javascript
用js脚本控制asp.net下treeview的NodeCheck的实现代码
Mar 02 Javascript
javascript验证上传文件的类型限制必须为某些格式
Nov 14 Javascript
javascript生成随机数方法汇总
Nov 12 Javascript
js创建对象几种方式的优缺点对比
Sep 28 Javascript
JS中input表单隐藏域及其使用方法
Feb 13 Javascript
Three.js中矩阵和向量的使用教程
Mar 19 Javascript
如何在Node和浏览器控制台中打印彩色文字
Jan 09 Javascript
微信小程序开发中var that =this的用法详解
Jan 18 Javascript
vue跳转页面的几种方法(推荐)
Mar 26 Javascript
jQuery使用jsonp实现百度搜索的示例代码
Jul 08 jQuery
Element Collapse 折叠面板的使用方法
Jul 26 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 分库分表hash算法
2009/11/12 PHP
mod_php、FastCGI、PHP-FPM等PHP运行方式对比
2015/07/02 PHP
将PHP程序中返回的JSON格式数据用gzip压缩输出的方法
2016/03/03 PHP
Yii2框架数据库简单的增删改查语法小结
2016/08/31 PHP
php防止sql注入的方法详解
2017/02/20 PHP
如何离线执行php任务
2017/02/21 PHP
jquery ajax请求方式与提示用户正在处理请稍等
2014/09/01 Javascript
jquery实现鼠标悬浮停止轮播特效
2020/08/20 Javascript
JavaScript判断按钮被点击的方法
2015/12/13 Javascript
原生JavaScript实现Ajax的方法
2016/04/07 Javascript
PhotoSwipe异步动态加载图片方法
2016/08/25 Javascript
jQuery实现点击后高亮背景固定显示的菜单效果【附demo源码下载】
2016/09/21 Javascript
利用Vue.js实现checkbox的全选反选效果
2017/01/18 Javascript
在vue中多次调用同一个定义全局变量的实例
2018/09/25 Javascript
VUE项目初建和常见问题总结
2019/09/12 Javascript
Vue data的数据响应式到底是如何实现的
2020/02/11 Javascript
[22:20]初生之犊-TI4第5名LGD战队纪录片
2014/08/13 DOTA
python操作xml文件详细介绍
2014/06/09 Python
django 自定义用户user模型的三种方法
2014/11/18 Python
使用PDB模式调试Python程序介绍
2015/04/05 Python
Python对数据进行插值和下采样的方法
2018/07/03 Python
使用Python抓取豆瓣影评数据的方法
2018/10/17 Python
解决pycharm每次打开项目都需要配置解释器和安装库问题
2020/02/26 Python
Python csv文件记录流程代码解析
2020/07/16 Python
利用Python将图片中扭曲矩形的复原
2020/09/07 Python
OpenCV利用python来实现图像的直方图均衡化
2020/10/21 Python
英国领先的名牌服装折扣零售商:Brown Bag Clothing
2019/01/08 全球购物
测量工程专业求职信
2014/02/24 职场文书
企业爱岗敬业演讲稿
2014/09/04 职场文书
完整版商业计划书
2014/09/15 职场文书
退学证明范本3篇
2014/10/29 职场文书
2015新年联欢晚会开场白
2014/12/14 职场文书
2016年妇联“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
html+css实现环绕倒影加载特效
2021/07/07 HTML / CSS
JavaScript原型链详解
2021/11/07 Javascript
MySQL数据库实验实现简单数据库应用系统设计
2022/06/21 MySQL