完成地圖可視化
1.服務器搭建(tip:白嫖3年國外服務器,谷歌雲,微軟雲,亞馬遜雲,每個可以試用一年;之后可以用阿里雲服務器,學生可以試用兩個月,普通新用戶可以試用37天)
這里我用阿里雲的服務器示例。
1.1 直接購買步驟(tip:直接購買需要賬戶里有100元余額,所以我用的免費試用)
首先進入阿里雲首頁,新用戶注冊登錄,選擇產品-->雲服務器ECS
點擊立即購買
進入基礎配置->網絡和安全組->系統配置->分組設置->確認訂單界面
基礎配置選擇了租的雲服務器的操作系統,硬件等;網絡和安全組給租的服務器調網絡帶寬,配置防火牆等;系統配置是設置這台電腦的登錄賬號和密碼。
基礎配置:
相應選擇的解釋:
按量付費:用多少付多少,比較便宜,也可以選擇包年包月。
地域選擇:選擇合適的地域,訪問服務器時。離該地域越近,速度越快。
為服務器配置兩核CPU,1Gb內存,已經可以支持疫情地圖的使用,越大越貴。
選擇突發性能實例:表示服務器在一天24個小時里,只有6個小時是可以全功率開啟的,對於我們的項目來說足夠了。
鏡像:鏡像代表服務器的操作系統,選擇鏡像市場,查看更多鏡像,找到寶塔控制面板,顯示0元/月,選擇。寶塔控制面板相當於給服務器裝了一個Linux操作系統,並安裝了一個電腦管家。
選擇高效雲盤,因為便宜。然后來個40g存儲。
點擊下一步,進入網絡和安全組:
選擇帶寬: 選擇按使用流量,拉滿80Mbps(疫情地圖呈現一次大概需要幾十kb,訪問六七萬次,才會使用8毛錢)。
點擊下一步系統配置:
選擇自定義密碼,給出自己的密碼。
點擊下一步分組設置:
因為被項目只租用一台服務器,所以就不用分組了
點擊下一步確認訂單:
勾選上服務協議,點擊創建實例。
接下來直接進入控制台界面:
點擊“實例”
將地域改為自己當時選擇的地域,就會發現自己購買的服務器。
然后就到下面的藍字部分繼續:
1.2 免費試用步驟
首先進入阿里雲首頁,新用戶注冊登錄,划到頁面最底部有“免費試用”按鈕,點擊
然后有兩個可以選擇,使用7天或者一個月,根據自己的需要選擇
點擊0元試用
選擇合適地域(這里以華北2北京示例),然后直接點擊立即購買
最后買完之后進入控制台
點擊實例,選擇地域,找到自己購買的服務器,然后勾選自己的服務器,選擇停止。對服務器進行配置上的修改(因為免費試用是沒有自己選擇服務器配置的)。
藍字藍字藍字藍字藍字藍字藍字
點擊雲盤和鏡像后,選擇更換操作系統,然后自定義密碼。
完成后,回到控制台。
現在已經完成了租了一個服務器,現在要去配置,管理這個服務器。
點擊更多->安全組配置
然后點擊配置規則
里面默認是有三個,我們現在去增加兩個,點擊手動添加
第一個:端口范圍輸入:80 授權對象選擇:0.0.0.0/0 點擊保存。
80是fttp協議默認端口號,方便用戶不用輸入冒號端口號就可以訪問。
授權對象選擇0.0.0.0/0,是為了讓所有人都可以訪問。
· ·
第二個:
8888是電腦管家(寶塔)的管理網址,授權對象可以設置0.0.0.0/0或者自己的ip,自己的ip相對來說比較安全,只有自己可以訪問電腦管家,但是筆記本電腦換一個網絡之后就連不上了,還要重新設置,比較麻煩。(tip:自己的ip地址可以直接百度查到)
然后回到控制台服務器頁面。
接下來點擊遠程連接
點擊第一個立即登錄
輸入自己設置的密碼,進入服務器操作界面,去給服務器要到自己寶塔系統的網址賬號密碼。
接着打開網址(外網面板地址)輸入賬號密碼(username/password)登錄。然后就打開了寶塔電腦管家,可以可視化的看到服務器運行狀態。
至此,算是搭建服務器完成,在阿里雲擁有了自己的一台電腦。這台電腦里還沒有裝任何的我們要用的軟件,沒有辦法把我們的資源共享出去,我們現在需要一款軟件可以把我們服務器里面的資源通過虛擬路徑的方式共享出去。這種軟件我們稱之為“應用服務器軟件”。
接下來裝這款軟件,進入軟件商店,搜索tomcat,點擊安裝,選擇tomcat9
安裝完成后,點擊tomcat最后面那個“設置”,選擇“配置修改”,找到第69行,將8080改為80,然后點擊保存,最后在“服務”里,點擊“重啟”。
(tip:因為我們之前開放了80的端口號給用戶訪問,但是tomcat默認端口號8080,所以要改一下端口號)
重啟完成后,就可以訪問服務器地址顯示tomcat的歡迎界面了
那么這個湯姆貓的界面是在哪里呢?
點擊文件夾
發現里面有個文件夾“webapps”,我們共享出去的一些資源就是這個文件夾里的資源。點擊進去
發現里面有五個文件夾,第一個是“ROOT”,這個文件夾在tomcat中被設置為歡迎文件夾,訪問這個文件夾里的內容不需要在地址后加/ROOT。
我們點擊進去,找到里面的“index.jsp”,這個就是湯姆貓的那個界面。選中,點擊編輯。
現在呢,我們要將這個里面的內容,換成我們的疫情地圖代碼。
2.疫情數據讀取
我們一定不是數據的生產者,只是數據的搬運工。
疫情數據都是人為收集出來,然后在網頁上做的呈現,沒有程序可以自動匯總這些數據,因為每個國家公布數據的方式都不一樣,有的國家是開發布會,有的國家是在網上公布一下,甚至有的三天兩頭不公布,所以不管是百度,丁香園還是網易的疫情地圖都是人為收集的數據,最后再整合到數據倉庫里面,然后再由程序進行取出與呈現。
接下來就要用到之前(day01)里面的代碼去網上讀取數據。這里開課吧為我們提供了一個網址(zaixianke.com/yq/all),都是整理好的疫情數據。
URL url = new URL("https://zaixianke.com/yq/all"); URLConnection conn = url.openConnection(); InputStream is = conn.getInputStream(); BufferedReader br = new BufferedReader(new InputStreamReader(is,"UTF-8")); String text = br.readLine(); br.close();
3.前后端整合上線
那么接下來就將index.jsp的代碼替換為疫情地圖代碼,並獲取疫情數據。
在這里提供疫情地圖代碼index.html和control.js兩個文件(前端程序員的工作),將index.html里的代碼粘到index.jsp里面,將control.js文件上傳到tomcat
兩個文件:鏈接:https://pan.baidu.com/s/1Mvy8-MAY_OmtHo5o7gQghg 提取碼:5ewq
接下來將index.jsp中寫死的疫情數據刪掉
替換為我們獲取的疫情數據(day01里面獲取網頁的代碼)
別忘了在上面導入需要的包
上線成功,接下來就可以通過服務器網址訪問疫情地圖了。
注:這是聽了開課吧平台,偉傑老師的三節課之后做的總結。
