建站
咨詢
售后
建站咨詢
新聞中心
hi, 大家好, 我是徐小夕, 周末博學(xué)不打烊, 今天我們來分享點(diǎn)輕松且有用的知識(shí). 作為一名前端工程師, 沒有個(gè)自己的網(wǎng)站怎么行, 接下來我就來帶大家介紹一下如何從零到一, 配置并部署自己的網(wǎng)站到服務(wù)器.
創(chuàng)新互聯(lián)自2013年起，先為合江等服務(wù)建站，合江等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為合江企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。
你將收獲:
- 如何合理選購一臺(tái)服務(wù)器
- 如何將域名解析到服務(wù)器上
- 服務(wù)器配套軟件的安裝和環(huán)境配置
- 通過命令行上傳自己的網(wǎng)站到服務(wù)器
- 網(wǎng)站部署和運(yùn)維(負(fù)載均衡等)
接下來我們來開始fight!
1. 如何合理選購一臺(tái)服務(wù)器
對(duì)于服務(wù)器的選擇, 我們主要有以下幾種選擇:
- 阿里云
- 騰訊云
- 華為云
- 亞馬遜云
國內(nèi)用戶如果沒有特殊需求可以選擇前三種, 這里我以阿里云舉例, 當(dāng)然其他服務(wù)器的配置都是相通的.
1.1 服務(wù)器位置的選擇
我們都知道服務(wù)器的不同配置都是有講究的, 并且一定程度上關(guān)系到我們網(wǎng)站的用戶體驗(yàn). 在選擇服務(wù)器地址之前, 我們需要清楚的知道自己網(wǎng)站的用戶群體主要集中在哪個(gè)區(qū)域:
image.png
比如我的用戶在上海, 我們?cè)诘赜蚣翱捎脜^(qū)選項(xiàng)中可以選擇華東2(上海), 以此類推.
1.2 服務(wù)器鏡像的選擇
image.png
目前我們常用的服務(wù)器鏡像有:
- centos
- windows Server
- Ubuntu
根據(jù)自己的使用習(xí)慣選擇即可, 我一般習(xí)慣選擇 centos, 接下來也會(huì)以 centos 來介紹相關(guān)的配置.
1.3 服務(wù)器系統(tǒng)盤存儲(chǔ)的選擇
image.png
系統(tǒng)存儲(chǔ)的選擇也需要結(jié)合自身網(wǎng)站, 如果網(wǎng)站是內(nèi)容很多的資源型網(wǎng)站(圖片, 視頻等), 可以選擇稍微大一點(diǎn)的, 比如 100G 以上. 一般個(gè)人網(wǎng)站或者測試站50G足已, 畢竟一份存儲(chǔ)一份錢.
1.4 服務(wù)器帶寬選擇
一般為了給用戶一個(gè)好的網(wǎng)站體驗(yàn), 我們會(huì)提高帶寬來降低網(wǎng)站加載時(shí)間. 但是一味的提高帶寬會(huì)大大加大服務(wù)器的費(fèi)用, 所以我們一方面需要在對(duì)網(wǎng)站自身做好優(yōu)化, 另一方面也可以使用對(duì)象存儲(chǔ), 這樣我們就能控制一定的帶寬了, 比如目前 H5-Dooring 的帶寬在10M左右, 一年服務(wù)器費(fèi)用大概 1-2W. 但是對(duì)一些測試型, 個(gè)人網(wǎng)站來說, 選擇2-5M都是一個(gè)合適的范圍.
當(dāng)然大家也可以選擇按流量付費(fèi).
1.5 服務(wù)器規(guī)格選擇
image.png
如果你是個(gè)人使用對(duì)吞吐性能沒有過多要求, 可以選擇1核1G低配版的, 不過建議個(gè)人網(wǎng)站最好選擇1核2G或者2核4G的, 說不定你的網(wǎng)站就突然了呢?
至于服務(wù)器的其他配置,大家都可以隨意選擇, 也可以直接用默認(rèn)的.
2. 如何將域名解析到服務(wù)器上
當(dāng)我們選購好一臺(tái)服務(wù)器之后, 我們?cè)诳刂婆_(tái)可以看到自己服務(wù)器的公網(wǎng)IP. 這也是域名解析的關(guān)鍵. 域名可以在云服務(wù)平臺(tái)內(nèi)直接購買, 一般一個(gè)域名在20-60￥之間, 推薦使用 .com, .cn的域名, 當(dāng)前其他后綴的域名也可以, 取決于你對(duì)網(wǎng)站的定位.
image.png
我們只需要在云服務(wù)的域名管理中添加需要解析的服務(wù)器記錄即可.
上圖的主機(jī)記錄配置中常用的有 www 和 @, 我們選擇任何一個(gè)即可. (主機(jī)記錄相當(dāng)于域名的前綴)
記錄值 就是我們服務(wù)器的IP, 也就是上面提到的公網(wǎng)IP. 我們配置好之后點(diǎn)確認(rèn), 等待5-10分鐘即可解析完成, 不過一般都在3分鐘內(nèi).
通過以上方式, 我們的域名就成功解析到對(duì)應(yīng)的服務(wù)器上了, 是不是很簡單? (前提是域名必須備案, 至于如何備案, 也很簡單, 可以按照云廠商指引進(jìn)行操作)
3. 服務(wù)器配套軟件的安裝和環(huán)境配置
有了上面服務(wù)器的配置基礎(chǔ), 我們開始“倒騰”服務(wù)器. 作為一名前端程序員, 服務(wù)器上沒有nodejs說不過去了吧! 接下來我們開始安裝nodejs. 在安裝之前, 我們需要先進(jìn)入服務(wù)器終端:
image.png
密鑰對(duì)一般在服務(wù)器列表的右側(cè)更多下拉項(xiàng)里, 我們一般第一次使用需要重置密鑰對(duì), 在設(shè)置好密鑰對(duì)之后, 我們?cè)谧约河?jì)算機(jī)的終端輸入如下命令:
ssh root@你的公網(wǎng)IP
之后在終端輸入完密碼之后即可進(jìn)入服務(wù)器.
如果服務(wù)器沒有wget, 我建議大家可以安裝一下, 畢竟后面很多場景都會(huì)用到.
yum install wget
是不是神似我們的npm. 之后我們就可以開心的安裝nodejs了:
# 安裝nodejs
wget https://nodejs.org/dist/v14.15.4/node-v14.15.4-linux-x64.tar.xz
# 解壓
tar xf node-v14.15.4-linux-x64.tar.xz
解壓完成之后我們可以手動(dòng)進(jìn)入 nodejs 的 bin 目錄, 測測nodejs是否可用. 但是下載下來的nodejs的目錄名又臭又長, 怎么辦呢? 這里就要學(xué)好linux了, 我這里給大家介紹一種簡單的重命名文件/目錄名的方法:
mv node-v14.15.4-linux-x64 nodejs
mv是linux移動(dòng)文件的命令,當(dāng)然如果在同一個(gè)目錄下, 它也可以做重命名功能使用.
最后一步就是配置nodejs全局環(huán)境了. 這里我們也是使用 linux 的命令ln.
ln -s /...你nodejs所在的更目錄/nodejs/bin/node /usr/local/bin/node
ln -s /...你nodejs所在的更目錄/nodejs/bin/npm /usr/local/bin/npm
這樣我們通過軟連接就實(shí)現(xiàn)在全局環(huán)境下使用nodejs.
4. 通過命令行上傳自己的網(wǎng)站到服務(wù)器
那么環(huán)境有了之后我們就可以直接上傳我們的網(wǎng)站代碼了, 因?yàn)槲覀冞x擇的是 centos 服務(wù)器, 它沒有可視化的界面來操作, 而且我的電腦是 mac的, 這可咋整呢? 不用擔(dān)心, 繼續(xù)用命令行!
我們可以使用命令行從本地上傳文件或文件夾到服務(wù)器, 也可以從服務(wù)器下載文件到本地電腦, 這些操作無疑多虧了scp. 接下來我將演示如何從本地上傳文件夾到服務(wù)器.
scp -r 本地文件夾路徑 root@你的公網(wǎng)IP:/上傳到的服務(wù)器路徑
# 如
scp -r ./dist root@xxx.xxx.xxx:/website/
其中-r是用來傳文件夾用的, 如果你要上傳的文件包含文件夾, 可以添加這個(gè)標(biāo)識(shí).
5. 網(wǎng)站部署和運(yùn)維(負(fù)載均衡等)
網(wǎng)站可以用nginx代理和做負(fù)載均衡, 網(wǎng)上也有很多資料介紹, 這里我?guī)Т蠹医榻B一下pm2.
PM2 是一個(gè)守護(hù)進(jìn)程管理器，它將幫助我們管理和保障應(yīng)用程序穩(wěn)定在線. 如果你是nodejs的忠實(shí)粉絲, 那么它將是個(gè)不錯(cuò)的選擇. 作為前端工程師, 搭建全棧的網(wǎng)站用nodejs也是一個(gè)非常高效的選擇.
安裝
最新的 PM2 版本可以使用 NPM 或 Yarn 安裝：
$ npm install pm2@latest -g
# or
$ yarn global add pm2
啟動(dòng)應(yīng)用
啟動(dòng)、守護(hù)和監(jiān)控應(yīng)用程序的最簡單方法是使用以下命令行：
$ pm2 start app.js
或輕松啟動(dòng)任何其他應(yīng)用程序：
$ pm2 start bashscript.sh
$ pm2 start python-app.py --watch
$ pm2 start binary-file -- --port 1520
我們可以傳遞給 CLI 的一些選項(xiàng)：
# Specify an app name
--name
# Watch and Restart app when files change
--watch
# Set memory threshold for app reload
--max-memory-restart <200MB>
# Specify log file
--log
# Pass extra arguments to the script
-- arg1 arg2 arg3
# Delay between automatic restarts
--restart-delay
# Prefix logs with time
--time
# Do not auto restart app
--no-autorestart
# Specify cron for forced restart
--cron
# Attach to application log
--no-daemon
如我們所見，有許多選項(xiàng)可用于使用 PM2 管理我們的應(yīng)用程序。目前H5-Dooring也是采用這種方式部署的, 所以如果你有自己的網(wǎng)站, 趕緊參考這個(gè)教程部署吧~
本文名稱：前端：從零到一，輕松把自己的網(wǎng)站部署到服務(wù)器
文章來源：http://www.5511xx.com/article/ccscsce.html
