純HTML頁面為了避免頻繁前后台Ajax交互方案


 

需求:

看這么一個簡單的界面。

它有很多下拉框,下拉框中的可選項並不是固定不變的。

由於頁面是靜態HTML頁面,不能使用后台JSP動態生成。

之前的解決方案是,頁面打開后使用多個Ajax請求,獲取下拉框中的數據。

改進方案:將所有的下拉框中的數據,緩存在后台一個js文件中,頁面引用這個js文件。這樣頁面打開的時候,直接訪問js文件中定義的變量就好了。

js文件動態生成,每當變量發生變化的時候,清掉緩存后台js緩存文件,下次請求的時候重新生成。

 

 

具體方案:

后台緩存數據的js文件分以下幾種:

1、application級別的數據js文件,整個系統只有一份。(無需鑒權)

         使用監聽器監聽application緩存的變化,application內的數據發生變化,則清掉js文件緩存,下次請求重新生成。

2、application級別但是區分例如公司實例等。(無需鑒權)

                    使用監聽器監聽TmsInstanceCacheUtil緩存的變化,TmsInstanceCacheUtil內的數據發生變化,則清掉js文件緩存,下次請求重新生成。

3、session級別的數據js文件,每個用戶登錄后有自己的一份。(需要鑒權)

        使用監聽器監聽session緩存的變化,session內的數據發生變化,則清掉js文件緩存,下次請求重新生成。

4、request級別的數據js文件,每次請求都是一份新的數據。(需要鑒權)

        每次請求都是返回最新的數據。不在后台生成js文件。

 

監聽session和application內容數據的變化,目前Java沒有對應的方法。系統需要提供一個工具類TmsSessionUtil,在里面實現對session內容的監控。

當然有些session或application內容數據的變化,不需要更新js文件。

 

/**
 * Created by 欒海鵬 on 2016/2/26.
 */
public class TmsSessionUtil {

    public static void setAttribute(String key,Object value){
        setAttribute(key,value,false);
    }

    /**
     *
     * @param key session緩存的key
     * @param value 對應的數據
     * @param scriptChange 此項session緩存是否影響緩存js文件
     */
    public static void setAttribute(String key,Object value,boolean scriptChange){

        //1、把key/value放進session對象

        //2、清理掉session-data-{{USER_ID}}.js文件

        //3、清理掉session中對session-data-{{USER_ID}}.js文件的緩存標記。

        //4、只有scriptChange為true的數據才會放入到js文件中。
    }

}

  

 

 

后台java有攔截器,攔截這種引入js文件的請求。如果使用了nginx等處理js文件請求,可以把文件后綴名改成別的,例如:session-data.djs

 

<script src='dscript/session-data.js' ></script>
<script src='dscript/application-data.js' ></script>
<script src='dscript/instance-data.js' ></script>
<script src='path/to/page/business.json?scriptVarName=TMS_REQUEST_INIT_DATA'></script>  --指定返回的變量名

  

 

 

 

 

 

目前系統中,已經完成了此功能的實現。但是代碼比較亂,寫這篇文章對這個方案進行整理。系統中這個方案在實現過程中也是一步一步來的。先實現了instanceId級別的js文件緩存,后實現了request級別的數據響應。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM