天天看點

ArcGIS API for JavaScript 4.x 本地部署之IIS法

【導讀】

關于如何在預設網站(Default Web Site,實體位址C:\inetpub\wwwroot\)啟動,已有很多部落格詳盡地寫好了。

本篇在自建網站(本機)中配置http而非https的jsAPI,jsAPI版本為4.10。

3.x的API也類似。

1. 準備工作-建立自定義網站

// 如何打開IIS、如何建立網站請移步IIS教程,比較簡單,部落格也很多,不再贅述。

以下為自定義網站的資訊清單:

  • 實體位址:D:\jsapi_lib\(預先在此檔案夾下放置一個index.html文檔以測試能否本地通路,熟練IIS的同志不放也無所謂)
  • 端口:1569(這個自己随便填,隻要沒被占用即可,關于端口的知識也有很多部落格,不再贅述)
  • 網站名稱:jsapi_lib(這個可以随便,盡量不要用中文,也可以和實體位址不同)

1.1 實體存儲

如下:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

其中,html檔案僅有一個h1标簽:

<h1>Hello World</h1>      

以測試網站有效性。

1.2 IIS的設定

ArcGIS API for JavaScript 4.x 本地部署之IIS法

因為是在本機本地環境測試,故IP位址選“全部未配置設定”即可。此處選擇http協定。

//  如果買了雲主機,且為IP配置了域名,則主機名可以填上域名,IP位址可以填得到的IP位址;本機測試請忽略此條。

建立站點完成并啟動後是這樣的:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

1.3 配置jsapi有關庫

将整個官網下載下傳來的api壓縮包内的第一個檔案夾解壓到D:\jsapi_lib\下:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

(圖中箭頭表示拖拽解壓這一動作)

然後,尋找此解壓檔案夾下的init.js和dojo.js,修改其中一段[HOSTNAME_AND_PATH_TO_JSAPI]字元串

ArcGIS API for JavaScript 4.x 本地部署之IIS法

[Note]

我們注意到,這裡的baseUrl寫的是

  • https://[HOSTNAME_AND_PATH_TO_JSAPI]dojo

這就代表,你要告訴整個api,它本身在目前web伺服器的哪個URL下能通路,也就是api中dojo檔案夾(在dojo中,又叫dojo子產品)的網絡位址(URL)。

是以這裡的baseUrl即dojo這個檔案夾(通俗說法)的URL,至于是什麼,請接着往下看。

其中二者的實體位址(也就是對于我這台電腦的磁盤位置來說)

  • init.js:  D:\jsapi_lib\arcgis_js_v410_api\arcgis_js_api\library\4.10\init.js
  • dojo.js:  D:\jsapi_lib\arcgis_js_v410_api\arcgis_js_api\library\4.10\dojo\dojo.js

是以在超文本傳輸協定(http)下的網絡位址為

  • init.js:https://localhost:1569/arcgis_js_v410_api/arcgis_js_api/library/4.10/init.js
  • dojo.js:https://localhost:1569/arcgis_js_v410_api/arcgis_js_api/library/4.10/dojo/dojo.js

因為本機未開啟https,是以init.js和dojo.js真正能被用的網絡位址為:

  • init.js:http://localhost:1569/arcgis_js_v410_api/arcgis_js_api/library/4.10/init.js
  • dojo.js:http://localhost:1569/arcgis_js_v410_api/arcgis_js_api/library/4.10/dojo/dojo.js

不難得出,實際上,http://localhost:1569即等價于 D:\jsapi_lib

為什麼http://localhost:1569打開後就是index.html這個測試頁呢?

是因為IIS配置了預設文檔,打開此URL會安預設文檔清單的順序打開對應實體位址下的某一個文檔,這在第二節會說。

是以[HOSTNAME_AND_PATH_TO_JSAPI]即等價于

  • [HOSTNAME_AND_PATH_TO_JSAPI] ≡ localhost:1569/jsapi_lib/arcgis_js_v410_api/arcgis_js_api/library/4.10/

是以,dojo檔案夾的網絡路徑即:

  • http://localhost:1569/arcgis_js_v410_api/arcgis_js_api/library/4.10/dojo/

修改後的init.js和dojo.js如下圖所示:

ArcGIS API for JavaScript 4.x 本地部署之IIS法
ArcGIS API for JavaScript 4.x 本地部署之IIS法

然後重新開機一下網站,在位址欄輸入init.js和dojo.js的網絡位址即可測試通路api是否加載成功。

--測試init.js:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

成功。

2. IIS網站預設檔案

上節提到,在不指定某個檔案的具體URL的情況下,打開http://localhost:1569能預設打開其對應實體位址下的index.html檔案,那麼

->如果打開http://localhost:1569要通路的是dojo.js檔案,這個需求如何解決?

就好比,通路https://js.arcgis.com/4.10/,實際通路的是https://js.arcgis.com/4.10/dojo/dojo.js一樣:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

其實隻需要配置網站的預設文檔即可。

IIS的網站有一個功能叫 預設文檔,在功能視圖下可以找到:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

然後,點進去配置預設文檔清單,越靠前的檔案越被優先通路,如果清單裡的文檔都沒有,就會出現403或者404界面~

這是我配置的:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

顯然,這裡的dojo.js檔案的路徑是相對路徑,相對于http://localhost:1569。

注意到index.html位于第五位,而dojo.js位于第一位,是以當然先通路dojo.js

是以http://localhost:1569被通路時,會自動尋找其實體位址下的arcgis_js_v410_api檔案夾下的arcgis_js_api檔案夾下的library檔案夾下的4.10檔案夾下的dojo檔案夾下的dojo.js檔案(真累啊)

如下圖:

ArcGIS API for JavaScript 4.x 本地部署之IIS法

=====本文測試環境為Windows 10,Chrome 69,api版本為4.10=====

繼續閱讀