基於nodeJS從0到1實現一個CMS全棧項目的服務端啓動細節

時間 2019-11-05

標籤基於 nodejs 實現一個 cms 項目服務啓動細節欄目 CMS 简体版

原文原文鏈接

因爲不少朋友對於我上一篇寫的CMS系統中後臺node部分的啓動有些不太理解的地方或者存在一些問題，這裏我會專門寫一下啓動的步驟和細節，關於CMS全棧系統感興趣的朋友能夠看看我以前寫的兩篇文章：javascript

1.基於nodeJS從0到1實現一個CMS全棧項目（上）css

2.基於nodeJS從0到1實現一個CMS全棧項目（中）前端

摘要

本文主要介紹以下內容：vue

redis的安裝及redis服務器的啓動
node服務器的啓動以及開發環境和正式環境的配置
服務器接口的測試及使用postman來測試接口

文章很短，但願你們能夠更好的進行後面node和前端部分的開發。java

1.redis的安裝及redis服務器的啓動

咱們能夠去redis官網下載redis安裝程序，我主要介紹window和 linux系統下的安裝，若是你是其餘系統，能夠去官網查看相關資料。node

window下安裝和啓動服務

下載地址：github.com/MSOpenTech/…react

Redis 支持 32 位和 64 位。這個須要根據你係統平臺來選擇，下載壓縮包到 C 盤，解壓而後將文件夾重命名爲 redis。（這裏方便記憶）linux

打開一個cmd窗口使用 cd 命令切換目錄到 C:\redis下，而後運行：

redis-server.exe redis.windows.conf
複製代碼

輸入以後，若是顯示以下界面，說明啓動成功:css3

固然咱們也能夠把redis路徑添加到環境變量裏，這樣就不用每次都在redis路徑下執行了腳本了。

這樣啓動尚未完，若是咱們想測試redis是否能夠執行，咱們上面啓動的cmd窗口千萬不能關，不然咱們跑node將會出現以下報錯：nginx

好了，咱們繼續，測試一下redis是否可用。首先咱們新建一個cmd窗口，切換到 redis 目錄下運行:

redis-cli.exe -h 127.0.0.1 -p 6379
複製代碼

設置鍵值對:

set user xxx
複製代碼

則會出現以下結果：

這樣，redis啓動這塊就能夠了。

linux下安裝啓動redis

下載地址：redis.io/download，建議…

$ wget http://download.redis.io/releases/redis-2.8.17.tar.gz
$ tar xzf redis-2.8.17.tar.gz
$ cd redis-2.8.17
$ make
複製代碼

make完後 redis-2.8.17目錄下會出現編譯後的redis服務程序redis-server,還有用於測試的客戶端程序redis-cli,兩個程序位於安裝目錄 src 目錄下，下面啓動redis服務：

$ cd src
$ ./redis-server
複製代碼

而後下面使用redis-cli的方式和window相似，這裏就不舉例子了，若是想詳細瞭解redis的配置和啓動，請認真研讀redis官方文檔。

2.node服務器的啓動以及開發環境和正式環境的配置

關於node的編譯和配置我在上一篇也簡單講了一下，這裏咱們具體介紹如何啓動項目和打包線上和發開環境代碼。

首先咱們看看package.json的執行代碼：

"scripts": {
   "start": "export NODE_ENV=development && nodemon -w src --exec \"babel-node src\"",
   "build": "babel src --out-dir dist",
   "run-build": "node dist",
   "test": "echo \"Error: no test specified\" && exit 1"
 }
複製代碼

咱們先看start，這裏主要用來啓動咱們開發環境的服務器，咱們經過export NODE_ENV=development來定義開發環境的環境變量，因爲我採用的是mac電腦，因此能夠用export來定義一個node環境變量；

window下咱們採用set NODE_ENV=development來定義。咱們用以下指令來啓動：

npm start
// or yarn start
複製代碼

其次咱們看看build命令，主要是打包輸出的命令，dist爲輸出的目錄名，你也能夠根據本身代碼風格來命名。

咱們執行以下來打包：

npm run build
// or yarn build
複製代碼

run-build命令是我額外加的，主要是方便測試生產環境的代碼，即咱們打包的後代碼。執行方式同上。

關於如何使用環境變量，這裏咱們能夠參考我項目中的config下的代碼：

const isDev = process.env.NODE_ENV === 'development';

//獲取本機ip地址
function getIPAdress() {
   var interfaces = require('os').networkInterfaces();&emsp;&emsp;
   for (var devName in interfaces) {&emsp;&emsp;&emsp;&emsp;
       var iface = interfaces[devName];&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
       for (var i = 0; i < iface.length; i++) {
           var alias = iface[i];
           if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
               return alias.address;
           }
       }&emsp;&emsp;
   }
}

const IP = getIPAdress();
const staticPath = isDev ? `http://${IP}:3000` : '線上地址';


module.exports = {
   isDev,
   staticPath
}
複製代碼

咱們可使用process.env.NODE_ENV來拿到咱們在package下定義的環境變量，而後進行不一樣的操做。以上代碼主要做用就是下其餘業務代碼傳遞環境變量，並對靜態路徑根據不一樣環境使用不一樣的ip地址，方便先後端調試。

3.服務器接口的測試及使用postman來測試接口

當咱們啓動好服務器後，咱們能夠利用ip去測試端口，因爲咱們初始化時會初始化config和admin數據，因此咱們可使用postman來測試接口可靠性，爲了方便理解，我會剖出初始化代碼，若是有不理解的，能夠可和交流。

// server/src/db/schema/config.js
// ...
// 初始化config數據
async function initConfig(){
   const isExist = await configSchema.exists()
   if(!isExist) {
       const result = await configSchema.hmset(null, {
           header: {
               columns: ['首頁'],
               height: '50',
               backgroundColor: '#000000',
               logo: ''
           },
           banner: {
               type: '1', // 0爲標籤雲，1爲輪播圖
               label: [],
               bgUrl: '',
               bannerList: []
           },
           bannerSider: {
               tit: '側邊欄信息',
               imgUrl: '',
               desc: ''
           },
           supportPay: {
               tit: '',
               imgUrl: ''
           }
       })
       if(!Array.isArray(result)) {
           console.log('配置信息初始化完成')
       }else {
           throw result
       }
   }
}

initConfig()
複製代碼

咱們在server/src/db/schema/config.js下能夠看到這段初始化config的代碼，接下來看看路由定義：

咱們找到server/src/routes/config.js,這裏咱們使用修飾器和class來定義咱們的路由api路徑爲/api/v0/config/all,因爲咱們開的服務跑在3000端口的，因此咱們使用postman這樣訪問：

這樣，是否是就拿到咱們以前定義好的初始化數據了呢？若是在操做中有其餘問題，能夠直接在咱們的羣裏或者直接問我，我會第一時間和你解答。

總結

綜上咱們服務器啓動的流程以下：

啓動redis服務器
運行node啓動腳本 npm start or yarn start
根據router定義的路由api，使用postman或者本地請求測試端口

最後

因爲今天搬家，時間沒有安排出來，明天將推出服務端剩下的部分，CMS全棧的管理後臺和客戶端部分的實現。包括：

實現自定義的koa中間件和restful API
koa路由和service層實現
模版引擎pug的基本使用及技巧
vue管理後臺頁面的實現及源碼分享
react客戶端前臺的具體實現及源碼分享
pm2部署以及nginx服務器配置

項目完整源碼地址我會在十一以前告訴你們，歡迎在公衆號《趣談前端》加入咱們一塊兒討論。

基於nodeJS從0到1實現一個CMS全棧項目的服務端啓動細節

摘要

1.redis的安裝及redis服務器的啓動

2.node服務器的啓動以及開發環境和正式環境的配置

3.服務器接口的測試及使用postman來測試接口

總結

最後

更多推薦