브라우저 js, css, 이미지 캐시_javascript 기술을 지우는 Ajax 방법

저는 물건을 만들 때 항상 서버에 있는 이미지의 주소를 데이터베이스에 저장한 뒤 브라우저에 표시하는데 나중에 두 가지 문제점을 발견했습니다.

첫째: 보안상의 이유로 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를 사용하여 스트림 객체를 로드한 다음 클래스 처리를 위한 코드를 사용합니다. 이것이 제가 springMVC, springMVC< 🎜를 사용하는 것입니다. >이 기간 동안

인기가 많아서 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()

클라이언트

코드 복사 코드는 다음과 같습니다.

함수 setImg(addr){
　　　　
                  $("#logo").attr("src","business/getImg?addr=" addr "");
            }

그림과 같이 이미지를 로드해야 할 경우 setImg 메소드를 실행하여 주소를 지정합니다. 물론 주소가 없더라도 당연히 배경에서 앞으로 전달되었습니다. 주소는 약간 변경될 수 있습니다. 백그라운드에서 주소를 가져온 다음 반환하고 src 속성을 img 태그에 설정하여 이미지를 가져옵니다.

다음은 jquery 1.2 버전에서 Ajax를 사용하여 브라우저의 js, css, 이미지 캐시를 지우는 방법을 소개합니다.

jquery에는 버전 1.2부터

ifModified 및 캐시 매개변수가 있으므로 헤더를 직접 추가할 필요가 없습니다.

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
});