利用nginx實現內網地圖瓦片代理

場景

• 客戶【服務器A(192.168.1.10)】在內網環檢，【服務器B(192.168.1.11)】有外網
• 【服務器A】可以訪問【服務器B】
• 【客戶的電腦】在和【服務器A】都處于內網

目標

• 讓客戶電腦能夠訪問外網的瓦片數據

解決方案

• 【服務器b】利用nginx搭建一個瓦片服務器proxy pass到各種地圖
• 瓦片服務器nginx關鍵配置如下

resolver 8.8.8.8; #此行非常關鍵,用作域名代理dns解析server {listen 7602;location ~^/(?<tilehost>[^/]+)/.+ {rewrite ^/[^/]+/(.+)$ /$1 break;proxy_pass http://$tilehost;}}

• 【服務器a】設置好一個URL的前綴代理到【服務器b】搭建好的瓦片服務器
• 【服務器a】nginx關鍵配置如下

server {listen 7601;location /gistiles/ {#設置一個習慣的Url前綴/gistiles 來轉發到【服務器B】proxy_pass http://192.168.0.11:7602/;}}

• Vue Cli 調試模式建議增加如下轉發

devServer: {host: "127.0.0.1",port: 8080,index: "login.html",proxy: {...'/gistiles/': {target: "http://192.168.0.59:7601"}}},

JS代碼后面怎么寫適應這種模式

例如

• 【原在】http://webst04.is.autonavi.com/appmaptile?style=8&x=415&y=220&z=9

• 【現在】/gistiles/webst04.is.autonavi.com/appmaptile?style=8&x=415&y=220&z=9

• 【原在】https://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetGray/MapServer/tile/11/886/1674

• 【現在】/gistiles/map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetGray/MapServer/tile/11/886/1674

談談坑點

花了一個下午時間各種調試，一開發現轉發的時候寫死域名不用變量就可以了，但是不知道為什么，各種查資料，甚至一度放棄，知道我嘗試直接去敲IP發現居然可以在proxy pass中使用$1這種變量，我就猜一定和DNS解析域名偶關系，果不其然就差這句“resolver 8.8.8.8;”，只能說還是自己反應太遲鈍。

總結

以上是生活随笔為你收集整理的利用nginx实现内网地图瓦片代理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。