文章版權由作者李曉暉和博客園共有，若轉載請於明顯處標明出處：http://www.cnblogs.com/naaoveGIS/
1.背景
一周前由於國家天地圖升級，造成多個項目地圖無法顯示。問題原因在於前端直接在線請求的天地圖WMTS服務，未進行緩存，所以當天地圖服務關閉后我方也被波及。采用前端直接獲取服務本身還是有不少優點：
- 互聯網服務本身已進行了各種加速優化
- 與采用CDN原理相同，避免請求造成我方后台壓力過大，並且可以規避瀏覽器對同一IP請求時並發數量限制
但是為立刻處理業主提出的后續優化方案，我基於已有的瓦片趴取工具，提出了整體瓦片預先緩存的方案。將緩存工具提供給工程讓其在天地圖恢復后進行瓦片下載，后續所有請求均走本地瓦片。但是該方案是存在兩個天然弊端的：
- 如果需要展示的范圍過大，下載數據非常耗時
- 無法自動更新，數據更新后又要重新下載更新
在必須采用緩存策略的情況下，如何可以減少現場實施同事的工作量？這里提出后台瓦片實時緩存方案。
2.方案設計
- 在線瓦片請求首先轉發至后端
- 后端根據傳入的layername、level、col、row，去查找本地是否有對應的緩存瓦片
- 若沒有則根據傳入的原始瓦片URL請求下載對應瓦片，將下載的瓦片緩存至本地對應的目錄下，並同時將下載的數據返回前端
- 若有則直接讀取本地瓦片返回前端
該方案對應的編碼涉及到前端瓦片請求URL的重構和后端對應的瓦片緩存邏輯實現。
3.方案實現
3.1前端請求重構
所謂瓦片請求只是一種泛稱，具體到類型可以分為很多種，比如通用Webtile類型、百度地圖類型、WMStile類型（用WMS服務來模擬瓦片請求)等等。以通用的Webtile為例：
getTileUrl:function(level, row, col){ var tileUrl = ""; var levelValue = this._levelToLevelValue[level]; var scale = this.tileInfo.lods[level].scale; tileUrl = this.urlTemplate.replace(/\${level\}/gi, levelValue).replace(/\${row\}/gi, row).replace(/\${col\}/gi, col).replace(/\${scale\}/gi, scale).replace(/\${layer\}/gi, this.layername); if(this.useProxy==1){ tileUrl=gis.global.tileCahceUrl+"?layerName="+encodeURI(this.layerName)+"&level="+ levelValue+"&col="+col+"&row="+row+"&raw="+encodeURIComponent(tileUrl); } tileUrl = this.addTimestampToURL(tileUrl); return tileUrl; }3.2后台對應模塊實現
BufferedInputStream bis = null; OutputStream os = null; byte[] buf = new byte[1024]; int len = 0; bis = new BufferedInputStream(is); os = response.getOutputStream(); FileOutputStream fos = null; if (!hasFile) { // 若不存在，則判斷文件路徑中各文件夾是否存在， if (!file.getParentFile().exists()) { file.getParentFile().mkdirs(); } fos = new FileOutputStream(file); } while ((len = bis.read(buf)) != -1) { os.write(buf, 0, len); if(!hasFile){ fos.write(buf,0,len); } } bis.close(); is.close(); os.close(); if(!hasFile){ fos.close(); }4.效果展示
可見前端請求后的瓦片在后台都進行了緩存。再次請求時將直接獲取緩存瓦片。
5.幾點優化
- 設置清空緩存數據參數。當該參數開啟時自動清除所有緩存，以最新瓦片進行再次緩存
- 后端與地圖圖片自動生成相關的模塊也均需調用緩存瓦片獲取接口
- 配置控制是否開啟緩存機制，避免不必要的頻繁瓦片請求給后端造成壓力
-----歡迎轉載，但保留版權，請於明顯處標明出處：http://www.cnblogs.com/naaoveGIS/
如果您覺得本文確實幫助了您，可以微信掃一掃，進行小額的打賞和鼓勵，謝謝 ^_^
