天天看點

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

我們在本地編寫完Node.js項目,需要将檔案打包上傳到雲伺服器,其他人才可以通過url位址來通路和浏覽我們編寫的程式,在申請、配置阿裡雲ECS伺服器的時候也是踩坑無數,看了網上很多大神的文章,自己也嘗試彙總整理了一下,文中涵蓋的知識點比較多,大概包含如下幾個方面:

  • 申請阿裡雲免費伺服器
  • 安裝node.js
  • 安裝Nginx伺服器
  • 安裝mongoDB資料庫
  • 安裝pm2程序管理工具
  • 安裝本地FTP
  • 上線移動端項目
注:本人使用的是MacOS系統,如果是windows環境,文中的部分操作會有所不同。

申請購買阿裡雲伺服器

首先:領取阿裡雲代金券¥2000紅包!

領取位址:

注冊阿裡雲賬号

在首頁選擇你的登入方式,可以通過阿裡旗下的第三方服務登入。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

這裡我使用支付寶登陸,掃碼進入頁面後點選授權即可。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

如果沒有阿裡雲賬号的話,可以輸入會員名和手機号碼進行快速注冊。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

注冊之後進入到ECS管理控制台頁面個人版,申請之前需要進行個人實名認證。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

點選個人實名認證連結進入實名認證頁面,選擇個人實名認證認證。

推薦個人支付寶授權認證此時再進入管理控制台頁面就可以看到有一台

雲伺服器

正在運作

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

重置執行個體密碼

在更多中找到重置執行個體密碼,點選設定密碼。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

該密碼不是你的阿裡雲賬号登入密碼,跳轉頁面後輸入家庭住址就可以完成認證了。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

雲伺服器通路密碼,必須由大寫字母、小寫字母、數字、特殊符号中的三項構成。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

重新開機執行個體

重置執行個體之後,點選右上角重新開機執行個體。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

在彈出的頁面中點選确定按鈕

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

重新開機執行個體之後會顯示停止中狀态,大概需要等待30秒。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

配置安全組

在側邊欄網絡與安全中找到安全組,點選右邊的配置規則。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

端口範圍填入:1/60000,為了使用更多服務,如果這個端口範圍填的太小了,像mongodb這種27017端口的資料庫就無法安裝。授權對象為0.0.0.0/0,為了讓所有端口都可以通路。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

點選确定儲存,就可以在頁面中看到我們配置好的安全組。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

遠端連接配接

可以使用它自帶的遠端連接配接,連接配接伺服器。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

點選遠端連接配接,系統會給你提供一個密碼用于遠端連接配接你的雲伺服器,該密碼隻出現一次,出現的時候需要記錄下來。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

在遠端連接配接中使用者名為:root,點選回車輸入之前重置過的執行個體通路密碼(預設輸入密碼的時候是不顯示的,輸入完成後點選回車即可)。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

但是我們一般不推薦在遠端連接配接中通路伺服器,原因是:如果超過一分鐘沒有操作就會自動斷開連接配接,需要重新輸入遠端連接配接密碼,比較繁瑣。而且在它的控制台中無法複制粘貼指令,隻能通過其視窗右上角的複制指令輸入來操作,比較麻煩。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

我們可以在本地終端cmd中通過ssh指令來通路雲伺服器

[email protected](你的公網IP)

可以在執行個體的配置資訊中找到公網IP

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

連接配接成功後運作檢視檔案指令:

cd /

ls

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

運作yum指令在雲伺服器上安裝Node.js

sudo yum install nodejs

安裝成功後顯示完畢,運作node -v檢視版本号:

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

安裝Nginx伺服器(靜态伺服器)

具體操作步驟出自這篇文章:

《CentOS 7 下安裝 Nginx》

https://www.linuxidc.com/Linu...
Nginx是一款自由的、開源的、高性能的HTTP伺服器和反向代理伺服器;同時也是一個IMAP、POP3、SMTP代理伺服器;Nginx可以作為一個HTTP伺服器進行網站的釋出處理,另外Nginx可以作為反向代理進行負載均衡的實作。
  1. gcc 安裝

安裝 nginx 需要先将官網下載下傳的源碼進行編譯,編譯依賴 gcc 環境,如果沒有 gcc 環境,則需要安裝:

yum install gcc-c++

安裝成功:

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. PCRE pcre-devel 安裝

PCRE(Perl Compatible Regular Expressions) 是一個Perl庫,包括 perl 相容的正規表達式庫。nginx 的 http 子產品使用 pcre 來解析正規表達式,是以需要在 linux 上安裝 pcre 庫,pcre-devel 是使用 pcre 開發的一個二次開發庫。nginx也需要此庫。指令:

yum install -y pcre pcre-devel

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. zlib 安裝

zlib 庫提供了很多種壓縮和解壓縮的方式, nginx 使用 zlib 對 http 包的内容進行 gzip ,是以需要在 Centos 上安裝 zlib 庫。

yum install -y zlib zlib-devel

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

3. OpenSSL 安裝

OpenSSL 是一個強大的安全套接字層密碼庫,囊括主要的密碼算法、常用的密鑰和證書封裝管理功能及 SSL 協定,并提供豐富的應用程式供測試或其它目的使用。

nginx 不僅支援 http 協定,還支援 https(即在ssl協定上傳輸http),是以需要在 Centos 安裝 OpenSSL 庫。

yum install -y openssl openssl-devel

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

4.下載下傳nginx安裝包

(1)第一種方式:直接下載下傳.tar.gz安裝包,nginx官網位址:

https://nginx.org/en/download...
阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

(2)第二種方式(推薦):使用wget指令下載下傳

wget -c

https://nginx.org/download/nginx-1.10.1.tar.gz

我下載下傳的是1.10.1版本,這個是目前的穩定版。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 解壓

依然是直接指令:

tar-zxvfnginx-1.10.1.tar.gz

cdnginx-1.10.1

  1. 配置

在 nginx-1.10.1 版本中你就不需要去配置相關東西,使用預設配置就可以了。

./configure

  1. 編譯安裝

make

make install

查找安裝路徑:

whereis nginx

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 啟動、停止、重新開機nginx

cd /usr/local/nginx/sbin/

./nginx

查詢nginx程序:

ps aux|grep nginx

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

啟動成功後,在浏覽器可以看到這樣的頁面:

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

./nginx -s stop:此方式相當于先查出nginx程序id再使用kill指令強制殺掉程序。

./nginx -s quit:此方式停止步驟是待nginx程序處理任務完畢進行停止。

重新開機nginx

(1)第一種方式:先停止再啟動(推薦):

對 nginx 進行重新開機相當于先停止再啟動,即先執行停止指令再執行啟動指令。如下:

./nginx -s quit

(2)第二種方式:重新加載配置檔案:

當 nginx的配置檔案 nginx.conf 修改後,要想讓配置生效需要重新開機 nginx,使用-s reload不用先停止 ngin x再啟動 nginx 即可将配置資訊在 nginx 中生效,如下:

./nginx -s reload

  1. 開機自啟動

即在rc.local增加啟動代碼就可以了。

vi /etc/rc.local

輸入字母i出現—INSERT—,按鍵盤上下鍵控制光标

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

将如下代碼複制粘貼

/usr/local/nginx/sbin/nginx

按esc鍵退出,輸入強制儲存退出指令:

:wq!

到這裡,nginx就安裝完畢了,啟動、停止、重新開機、開機自啟動操作也都完成了。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
MongoDB 是一個介于 關系資料庫和非關系資料庫 之間的産品,是非關系資料庫當中功能最豐富,最像關系資料庫的。他支援的資料結構非常松散,是類似json的bson格式,是以可以存儲比較複雜的資料類型。Mongo最大的特點是他支援的查詢語言非常強大,其文法有點類似于面向對象的查詢語言,幾乎可以實作類似關系資料庫單表查詢的絕大部分功能,而且還支援對資料建立索引。
  1. 建立yum源檔案

vim /etc/yum.repos.d/mongodb-org-3.4.repo

  1. 添加以下内容

[mongodb-org-3.4]

name=MongoDB Repository

baseurl=

https://repo.mongodb.org/yum/redhat/

$releasever/mongodb-org/3.4/x86_64/

gpgcheck=1

enabled=1

gpgkey=

https://www.mongodb.org/static/pgp/server-3.4.asc

字母i代表INSERT寫入

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

複制上面内容粘貼後按esc,輸入

:(冒号)wq!(感歎号)

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

強制儲存并退出

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 安裝MongoDB

安裝指令:

yum -y install mongodb-org

安裝完成後顯示:

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 安裝完成後,檢視mongo安裝位置

whereis mongod

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

檢視修改配置檔案 的指令是: vim /etc/mongod.conf

  1. 啟動mongodb

systemctl start mongod.service

順便說一下停止mongodb的指令是 :systemctl stop mongod.service

  1. 檢視mongodb的狀态

systemctl status mongod.service

顯示active(running)說明已經成功開啟。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 停止防火牆

CentOS 7.0預設使用的是firewall作為防火牆,這裡改為iptables防火牆。

外網通路需要關閉firewall防火牆:

systemctl stop firewalld.service

  1. 禁止防火牆開機啟動

systemctl disable firewalld.service

  1. 設定開機啟動

systemctl enable mongod.service

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 啟動Mongo shell檢視資料庫

執行完以上操作步驟後輸入指令:mongo,檢視資料庫show dbs。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 設定mongodb遠端通路

設定完之後可以在本地連接配接資料庫

輸入

vim /etc/mongod.conf

編輯mongod.conf配置檔案,找到bindIP,在前面按i輸入#注釋掉這一行,輸入:wq!儲存退出。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 重新開機mongodb

systemctl restart mongod.service

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
PM2是node程序管理工具,可以利用它來簡化很多node應用管理的繁瑣任務,如性能監控、自動重新開機、負載均衡等。

當我們在

伺服器

中啟動node服務時如果直接通過npm start或者node index.js啟動,則一旦退出ssh遠端登入,或者在本地關閉終端則服務就會停止運作,是以我們要安裝pm2這個node程序管理工具,通過pm2 start來開啟程序就不會出現這個問題了。

全局安裝指令:

npm install -g pm2

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

安裝成功後運作pm2 list檢視所有程序狀态

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

這裡推薦使用FileZilla,這是一款免費、開源、跨平台的FTP軟體,mac系統windows系統的使用者都可以放心食用。這裡我們使用SFTP連接配接,端口号預設值是22.

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

連接配接成功後會列出root下的目錄

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 修改項目配置檔案

找到項目的Vue-config.js配置檔案,在module.exports中将publicPath: 改為:'/v-douban/'。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

同時本地請求資料的路徑也需要加上/v-douban

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
  1. 打封包件

執行yarn build 将項目打包成dist檔案包

  1. 連接配接FTP伺服器,修改nginx

進入/usr/local/nginx/conf目錄,傳輸nginx.config檔案到本地。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

修改nginx.config檔案,配置資料接口代理。

location /api/db {

proxy_pass

http://47.96.0.211:9000/db;

}

location /data/my {

http://118.31.109.254:8088/my;

location /douban/my {

http://47.111.166.60:9000/my;

上傳新的nginx.config檔案到伺服器,覆寫原檔案。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

在終端連接配接資料庫,并且重新開機nginx伺服器。

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

進入/usr/local/nginx/html目錄建立一個v-douban檔案夾

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

将打包後的dist檔案夾中的所有檔案上傳到伺服器

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

傳輸完成後,即可在網頁中通路上線項目

http://39.96.84.220/v-douban
阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器

線上浏覽效果:

阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
阿裡雲伺服器部署web項目全過程 申請購買阿裡雲伺服器
原文位址