ブラウザのjs、css、画像キャッシュをクリアするAjaxメソッド_javascriptスキル

私は何かを作るとき、いつもサーバー上の画像のアドレスをデータベースに保存し、ブラウザで表示するのですが、後から二つ問題があることが分かりました。

第一: セキュリティ上の理由から、js はローカル画像を読み取ることができません。そうでない場合、js を作成すると、誰のコンピュータでもファイルを取得できます。

2 番目: 画像はクライアントのハード ドライブではなくサーバーのハード ドライブに保存されているため、取得できません

その後、インターネットでメソッドを検索しました。見つけたメソッドは、バイナリを 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 メソッドをトリガーして、アドレスを背景から前面に渡します。アドレスの場合は少し変更することができます。バックグラウンドでアドレスを取得して戻り、img タグに src 属性を設定して画像を取得します。

以下では、jquery 1.2 バージョンで Ajax を使用してブラウザの js、css、画像キャッシュをクリアする方法を紹介します。

jquery にはバージョン 1.2 以降、ifModified パラメータとキャッシュ パラメータがあるため、自分で 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
});