標籤：
由於之前公司網速一直不行，所以一直沒有對新版本號碼為1.1的webappbuilder進行試用，昨天參加了esri開發人員大會又讓我忽然想起來這個1.1版本的還沒體驗呢，熬了一個多月的渣網速之後，終於在今天熬到頭了（鼓掌慶祝下），公司終於把盼望已久的光纖牽進來了，趁著大家都在參加esri開發人員大會的工夫，重新寫一篇從零開始使用webappbuilder的教程吧。第一步自然是下載咯點我下載webappbuilder下載不了的可以去我之前的一篇文章 ArcGIS Web API集錦 裡面有百度網盤的分享連結
第二步解壓 這個自不用說（解壓到任意檔案夾即可，webappbuilder內部自己實現了一個web伺服器，不需要依賴iis、tomcat或者apache）
請無視我雜亂無章的下載目錄讓我們看看webappbuilder的目錄結構
從上到下檔案夾依次是用戶端、文檔、服務端，中間三個txt就不看了，最後一個是windows啟動指令碼類似於linux的bash指令碼
上面的是server的目錄結構，webappbuilder是基於nodejs express架構實現的，這裡可以不需要再安裝node的運行環境了，可以看到目錄裡面已有了node的32和64位運行環境。廢話不多說，點擊
我們來啟動webappbuilder不出意外的話你的案頭會出現這樣的一個黑框框，並且自動啟動瀏覽器進入webappbuilder頁面
到這裡估計很多人就望而卻步了，根本不知道填什麼啊，本地也沒搭portal啊，試了好多地址都不能用啊，然後聽說還要去申請企業級帳號，但是這個帳號申請流程對於一些人來說可能還覺得很麻煩，於是很多人到這一步就自然放棄了，即使很想去體驗一下webappbuilder，只能看著別人群裡眼饞，又苦於不知道方法。這裡給廣大的GISer帶來一個好訊息，只要你有esri的帳號，arcgisonline的那個就可以，下載過webapi的人應該都有這個帳號。但是如果你連這個帳號都沒有的話，那麼我想你需要去面壁幾分鐘了，好了，不扯這個了，我就假設大家都有這個帳號了。其實arcgisonline的帳號是可以作為webappbuilder的portal的url地址來登入的。這裡給大家再敲一下這個地址http://www.arcgisonline.cn/portal，其實在我上一篇文章也說過這個方法，但是那是針對1.0版本的，1.1版本的多了下面的這個應用程式id，是不是到這一步又要崩潰了，沒事多崩潰幾次內心自然就強大了，這裡也不賣關子，聽我繼續往下說。
到這一步其實已經快要成功了，是啊 就差一個應用程式id了嘛，讓我們先別看這個頁面了，我們重新開一個網頁，輸入http://www.arcgisonline.cn/進入如下頁面
點擊右上方登入，圖裡我已經登入了（這裡我就不示範怎麼登入了），我們直接切入正題
滑鼠勇敢的點擊內容菜單吧，另外說下，對於上一步沒有帳號的童鞋自覺點擊大大的
按鈕註冊吧，點擊之後出現這樣的一個頁面
點擊應用程式標籤，再點擊添加項目：
出現如下頁面，參照下面的選擇：
點擊添加項目按鈕
之後，會轉到這樣的一個頁面
這裡我們需要進行一些設定：點擊
你會發現你渴望已久的應用程式id出現了
，等等等！！！！別興奮太早，你如果認為你輸入這個id進去就可以順利進入webappbuilder頁面的話，我想說你太天真了，你可能會出現一個錯誤頁面，好事還需多磨，耐心往下看：
點擊上方的編輯按鈕進入編輯頁面，編輯頁面圖太大，我就不截全圖了，截取重要的應用程式註冊這裡
點擊更新按鈕
這裡參照圖1、2步刪掉原有的那一串看不懂的字元
仔細看重新導向url的輸入框的placeholder，是讓我們填入一個http://ip:host的地址
這裡我們填入webappbuilder預設的連接埠號碼3344
這裡我用主機名稱直接代替了ip，之前微博看一個童鞋使用的時候出現了一些問題這裡說一下要跟你剛進去的那個地址對應如果你是http://主機名稱：連接埠號碼/webappbuilder/的話你也一定要注意更改那個url重新導向為這個http://主機名稱：連接埠號碼，這裡我疏忽了，如果是127.0.0.1:3344或者localhost：3344甚至是ip：連接埠號碼的話你也需要按照這個規則來改那個url重新導向地址。總之就是要對應的設定重新導向地址！！！切記！！！最狠的辦法是一次性把你要加的重新導向地址全部加上，像下面這個樣子一勞永逸，不管是靜態ip還是localhost還是127.0.0.1等都可以正確的重新導向了
填好之後點擊添加，就可以看到你填入的那個地址取代了之前那個討厭的一堆看不懂的字元的位置，再點擊更新按鈕彈出窗關閉，最後千萬別忘了點擊頁面左下角的那個大大的儲存按鈕！！！到這裡恭喜你應該得到了你想要的應用程式id
將這個id填入我們之前擱置的那個webappbuilder讓你糾結已久的頁面
點擊繼續按鈕出現一個許可權確認頁面，點擊同意
duang！！！duang！！！duang！！！大功告成！
建立一個應用程式試試看
隨便更改一些設定看看預覽
好了，這個教程就做到這裡吧，要開始幹活了。歡迎大家吐槽，對於教程的任何問題可以與我微博交流，我會儘力協助大家。補充說明一下，其實勾選應用程式中的web製圖也是可以的
後面只要選擇註冊id，再添加url重新導向也一樣可以使用
webappbuilder申請與使用（轉）
