從零開始,Windows作業系統下的超詳細的阿里雲釋出專案過程

榮光無限發表於2020-08-11
Windows作業系統阿里
  • 圖片小,建議放大瀏覽器尺寸,不會失真.

?? ==================== 步驟0: 購買阿里雲伺服器 ====================

  • ? 0.1 從來沒有搞過外網部署的我，當然是先買伺服器了，感謝很多小夥伴的幫忙?

  • ? 0.2 登入 阿里雲網址

  • ? 0.3 選擇 雲伺服器ECS (不要選香港的,後期備案容易出問題)

  • 像我這種沒有經驗的先買一個月的試玩下,土豪請無視，任意選擇?！

  • 選擇 Ubantu映象,社群大，資源多，出現問題比較容易得到解決

  • ? 0.4 確認下單

  • ? 0.5 確認支付

  • ? 0.6 掃一掃，你就會損失一些money?

  • ? 0.7 恭喜你，拾取伺服器一臺?

  • ? 0.8 建議修改例項密碼，為本地機器訪問(請記住你設定的密碼)

?? ==================== 步驟1: 開啟window的ssh ====================

  • ? 1.1 右下角 -> 所有配置

  • ? 1.2 應用

  • ? 1.3 可選功能

  • ? 1.4 新增可選功能 OpenSSH客戶端

  • ? 1.5 測試ssh 是否啟動成功，命令列 ssh

  • ? 1.6 用root賬戶連線阿里雲遠端伺服器 ssh root@47.114.105.120 -p 22

  • 47.114.105.120是雲伺服器的外網ip, -p 22 指定埠為22

  • password: ? 0.8中設定的密碼

ssh root@47.114.105.120 -p 22

  • 哇，登入成功了,好興奮啊,作為完全沒使用過Linux/Ubantu的小白來說不要太興奮 ??

  • ? 1.7 使用 ls命令檢視伺服器的檔案

  • 我之前釋出專案建立過一個資料夾realworld-nuxtjs

  • 具體步驟會在下一部分出現

?? ==================== 步驟2: 遠端操作伺服器,上傳專案的壓縮包 ====================

  • ?‍? 2.1 給伺服器建立一個目錄,存放要釋出專案的資源

  • ?‍? 2.2 跳轉到新建的目錄下

  • ?‍? 2.3 準備要釋出專案的壓縮包(依專案實際情況而定)

  • 由於現在要釋出的是nuxt專案,將這5個檔案選中進行壓縮打包(壓縮後的檔案是realworld-nuxtjs.zip)

  • ?‍?2.4 新建一個本地命令視窗,使用scp(secure copy)上傳本地壓縮檔案到遠端伺服器

  • scp = secure copy：Linux系統或者Ubuntu的安全copy命令

  • 這部分操作不是在遠端ssh連結

  • 而是壓縮檔案所在的目錄

# 將2.3中本地壓縮的檔案上傳到遠端伺服器
scp .\realworld-nuxtjs.zip root@47.114.105.120:/root/realworld-nuxtjs
# 語法格式 scp filepath\filename account@remote address:root/directory

  • ?‍?2.5 通過【ssh命令視窗】或者【伺服器上的遠端連線】檢視 上傳的檔案, 本地打包的檔案已經上傳到伺服器了

?? ==================== 步驟3: 伺服器上的檔案操作和必需的模組安裝 ====================

  • 以下操作可通過【ssh命令視窗】或者【伺服器上的遠端連線】

  • 操作目錄,之前新建的realworld-nuxtjs

  • ⚡ 3.1 安裝 unzip模組 => 解壓我們之前上傳的zip檔案 apt install unzip

  • ⚡ 3.2 安裝 nodejs模組 提供專案的依賴環境

# 指定資源模組: setup_12.x代表的是nodejs版本12.x,可根據自己的需要自行修改
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
# 安裝nodejs
sudo apt-get install nodejs


  • ⚡ 3.3 安裝 npm模組 提供專案的模組依賴下載
# 安裝 npm 模組
sudo apt install npm
#如果出現問題，執行
sudo apt-get install nodejs-dev node-gyp libssl1.0-dev
# 然後再執行
sudo apt install npm

  • 通過npm -v 和 node -v 檢視是否安裝成功

  • ⚡ 3.4 解壓上傳的資源包

# 解壓資源包
unzip realworld-nuxtjs

  • ⚡ 3.5 安裝依賴
# 根據package.json安裝專案的相關依賴
npm install
  • ⚡ 3.6 執行專案
npm run start

  • 成功了!!!

?? ==================== 步驟4: IP/PORT 配置項 ====================

  • ? 4.1 IP

  • 步驟3中專案啟動後的地址是伺服器的私有IP http://172.27.110.181:3000/ 不能對外訪問

  • 需要將自己的公網IP替換後才可以 http://47.114.105.120:3000

  • ? 4.2 埠,3000埠號是在專案檔案裡配置的,所以我們要去【本例項安全組】開啟3000埠的使用

  • 【本例項安全組】-> 【配置規則】-> 【手動新增】

  • 紅框內的是系統自帶的, 綠色的是手動新增的埠號為3000的一條規則

  • 到這裡,如過沒有特殊情況,服務可以被外網訪問了 RealWorld-Nuxt ✅

?? ==================== 步驟5: 其他配置項 ====================

  • ? 5.1 檢視伺服器防火牆狀態
# 伺服器防火牆狀態: active-啟動 | inactive-關閉
sudo ufw status
# 開啟或關閉
sudo ufw enable|disable

  • ? 5.2 檢視埠號狀態
netstat -anp|grep 3000

  • ? 5.3 未完待續...

相關文章