CentOS7使用Nginx和pm2部署vue和node服務(wù)

最近有點(diǎn)迷戀了Linux系統(tǒng)的部署項(xiàng)目，個(gè)人在整個(gè)安裝部署過(guò)程中遇到各種各樣的坑，所以在這里我決定寫(xiě)一篇從0開(kāi)始的部署文檔，以供大家參考。廢話不多說(shuō)，咱們直接切入主題。。。

? 首先我們有了服務(wù)器，先把mysql數(shù)據(jù)庫(kù)安裝上，這里就不多說(shuō)了，如果有不明白的小伙伴，請(qǐng)進(jìn)入這里。

? 通常數(shù)據(jù)庫(kù)安裝完成之后，連接時(shí)候還會(huì)遇到一個(gè)坑，在命令行中可以正常登陸使用數(shù)據(jù)庫(kù)，但是通過(guò)客戶(hù)端連接時(shí)候，常常會(huì)報(bào)錯(cuò)，那么這個(gè)時(shí)候參考一下這篇文章，希望可以幫到你。接下來(lái)，我就來(lái)說(shuō)說(shuō)具體的配置以及部署過(guò)程。

1、Nginx的安裝以及配置

? nginx是一個(gè)開(kāi)源且高性能、可靠的HTTP中間件和代理服務(wù)器

  1. 操作系統(tǒng)

    CentOS>7.0,位數(shù) X64

  2. CentOS系統(tǒng)關(guān)閉防火墻

    停止防火墻      systemctl stop firewalld.service  
永久關(guān)閉防火墻   systemctl disable firewalld.service

  3. 確認(rèn)停用selinux

    • 安全增強(qiáng)型 Linux（Security-Enhanced Linux）簡(jiǎn)稱(chēng) SELinux，它是一個(gè) Linux 內(nèi)核模塊，也是 Linux 的一個(gè)安全子系統(tǒng)。
    • SELinux 主要作用就是最大限度地減小系統(tǒng)中服務(wù)進(jìn)程可訪問(wèn)的資源（最小權(quán)限原則）。
    檢查狀態(tài)       getenforce
檢查狀態(tài)       /usr/sbin/sestatus -V
臨時(shí)關(guān)閉       setenforce 0
永久關(guān)閉       vi /etc/selinux/config   將SELINUX=enforcing改為SELINUX=disabled

  4. 安裝系統(tǒng)以來(lái)模塊

    yum  -y install gcc gcc-c++ autoconf pcre pcre-devel make automake
yum  -y install wget httpd-tools vim

    安裝完成都看到Complete!標(biāo)識(shí)都安裝成功。


    安裝依賴(lài).png

  5. 安裝Nginx

    下載地址

  6. 使用yum安裝

    本人安裝使用的第二種方式，使用yum安裝Nginx

    首先進(jìn)入yum.repos.d目錄下創(chuàng)建nginx.repo文件，將官網(wǎng)的配置文件粘貼進(jìn)去

    vi /etc/yum.repos.d/nginx.repo

    貼入官方配置信息

    [nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key

[nginx-mainline]
name=nginx mainline repo
baseurl=http://nginx.org/packages/mainline/centos/$releasever/$basearch/
gpgcheck=1
enabled=0
gpgkey=https://nginx.org/keys/nginx_signing.key
下載.png

安裝配置.png
配置nginx安裝文件.png
 安裝

 ```
 yum install nginx -y
 查看安裝好的Nginx信息
 nginx -v
 nginx -V
 ```

 好了到這里Nginx就算安裝上了，至于配置文件先放一放，等項(xiàng)目都拷貝上來(lái)，再進(jìn)行配置。

 這里簡(jiǎn)單給大家看一下nginx的默認(rèn)配置信息都代表什么

 /etc/nginx/nginx.conf

 ```
 user  root;   設(shè)置nginx服務(wù)的系統(tǒng)使用用戶(hù) 例：我是用root用戶(hù)  所以我配置的是root
 worker_processes  1;  工作進(jìn)程數(shù),一般和CPU數(shù)量相同 
 
 error_log  /var/log/nginx/error.log warn;   nginx的錯(cuò)誤日志  
 pid        /var/run/nginx.pid;   nginx服務(wù)啟動(dòng)時(shí)的pid
 
 events {
     worker_connections  1024;每個(gè)進(jìn)程允許的最大連接數(shù) 10000
 }
 
 http {
     include       /etc/nginx/mime.types;//文件后綴和類(lèi)型類(lèi)型的對(duì)應(yīng)關(guān)系
     default_type  application/octet-stream;//默認(rèn)content-type
 
     log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                       '$status $body_bytes_sent "$http_referer" '
                       '"$http_user_agent" "$http_x_forwarded_for"';  //日志記錄格式
 
     access_log  /var/log/nginx/access.log  main;//默認(rèn)訪問(wèn)日志
 
     sendfile        on;//啟用sendfile
     #tcp_nopush     on;//懶發(fā)送
 
     keepalive_timeout  65;//超時(shí)時(shí)間是65秒
 
     #gzip  on;gzip壓縮
 
     include /etc/nginx/conf.d/*.conf;//包含的子配置文件
 }
 ```

 default.conf

 ```
 server {
     listen       80;  //監(jiān)聽(tīng)的端口號(hào)
     server_name  localhost;  //用域名方式訪問(wèn)的地址
 
     #charset koi8-r; //編碼
     #access_log  /var/log/nginx/host.access.log  main;  //訪問(wèn)日志文件和名稱(chēng)
 
     location / {
         root   /usr/share/nginx/html;  //靜態(tài)文件根目錄
         index  index.html index.htm;  //首頁(yè)的索引文件
     }
 
     #error_page  404              /404.html;  //指定錯(cuò)誤頁(yè)面
 
     # redirect server error pages to the static page /50x.html
     # 把后臺(tái)錯(cuò)誤重定向到靜態(tài)的50x.html頁(yè)面
     error_page   500 502 503 504  /50x.html; 
     location = /50x.html {
         root   /usr/share/nginx/html;
     }
 
     # proxy the PHP scripts to Apache listening on 127.0.0.1:80
     # 代理PHP腳本到80端口上的apache服務(wù)器
     #location ~ \.php$ {
     #    proxy_pass   http://127.0.0.1;
     #}
 
     # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
     # 把PHP腳本9000端口上監(jiān)聽(tīng)的FastCGI服務(wù)
     #location ~ \.php$ {
     #    root           html;
     #    fastcgi_pass   127.0.0.1:9000;
     #    fastcgi_index  index.php;
     #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
     #    include        fastcgi_params;
     #}
 
     # deny access to .htaccess files, if Apache's document root
     # concurs with nginx's one
     # 不允許訪問(wèn).htaccess文件
     #location ~ /\.ht {
     #    deny  all;
     #}
 }
 ```

2、Node，npm，cnpm和pm2的安裝

  1. 使用二進(jìn)制方式安裝Node，根據(jù)自己的操作系統(tǒng)位數(shù)選擇相應(yīng)的壓縮包。

    • 使用下面命令下載到Linux系統(tǒng)中

    wget https://nodejs.org/dist/v10.16.3/node-v10.16.3-linux-x64.tar.xz

    • 解壓下載好的文件：

      xz -d node-v10.16.3-linux-x64.tar.xz
tar -xvf node-v10.16.3-linux-x64.tar

    • 進(jìn)入解壓好的node文件的bin目錄下，會(huì)看到三個(gè)文件node、npm和npx，在這里可以查看node版本號(hào)來(lái)確認(rèn)是否成功

      cd node-v10.16.3-linux-x64/bin
ls
./node -v

    • 接下來(lái)配置一下node和npm的軟連接方式，這里因?yàn)槲野惭bnode是在/root目錄下進(jìn)行的，因?yàn)槠胀ㄓ脩?hù)是沒(méi)有/root下的權(quán)限，所以需要映射出來(lái)，可以提供給其他用戶(hù)使用，不行你可以直接在CentOS系統(tǒng)中直接執(zhí)行node -v是報(bào)錯(cuò)的。一般有兩種方式添加映射連接方式，第一種是軟連接，第二種就是配置環(huán)境變量。本文中就用第一種方式，有興趣的話可以自己查查第二種方式如何配置。

      我們將node和npm連接到/usr/local/bin目錄下，操作如下

      ln -s /node-v10.16.3-linux-x64/bin/node  /usr/local/bin/node
ln -s /node-v10.16.3-linux-x64/bin/npm  /usr/local/bin/npm

      執(zhí)行完之后可以進(jìn)如/usr/local/bin目錄下查看是否有node和npm文件，如果有，說(shuō)明成功。

      現(xiàn)在再執(zhí)行npm-v和node-v就能看到對(duì)應(yīng)的版本信息了

    軟連接.png
 * 接下來(lái)使用npm來(lái)安裝cnpm和pm2,安裝成功之后同樣需要軟連接配置到/usr/local/bin目錄下。

   ```
   npm install -g cnpm --registry=https://registry.npm.taobao.org
   npm install -g pm2
   ```

   軟連接cnpm和pm2

   ```
   ln -s /node-v10.16.3-linux-x64/bin/cnpm  /usr/local/bin/cnpm
   ln -s /node-v10.16.3-linux-x64/bin/pm2  /usr/local/bin/pm2
   ```
全部軟連接.png

3、部署vue項(xiàng)目和Node(Koa2)服務(wù)

  1. vue項(xiàng)目打包部署

    • 打包的vue項(xiàng)目中不能存在debugger，否則打包失敗
    • 注意自己的項(xiàng)目是否開(kāi)啟路由的history模式，后面配置nginx會(huì)有不同

  2. Koa2服務(wù)部署

    • 因?yàn)槭莕ode服務(wù)，直接把本地的項(xiàng)目除了node_modules文件和自己的一下不需要的文件過(guò)濾到拷貝到服務(wù)器指定的目錄下面就可以，然后再服務(wù)器上運(yùn)行cnpm install 或者npm install命令來(lái)安裝依賴(lài)包，安裝完之后，在此執(zhí)行npm start測(cè)試node服務(wù)時(shí)候啟動(dòng)成功。
部署目錄.png

  1. 配置nginx配置文件，來(lái)代理vue項(xiàng)目和node服務(wù)

    直接進(jìn)入nginx的default.conf配置文件來(lái)配置就行

    server {
    listen       52525; # 訪問(wèn)端口
    server_name  127.0.0.1; #這里配置的IP為虛擬機(jī)的連接IP 如果是阿里云則改為公網(wǎng)IP

    #charset koi8-r;
    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /home/lvsq/Web; # vue項(xiàng)目存放的靜態(tài)地址
        index  index.html index.htm;
        try_files $uri $uri/ /index.html; # vue路由開(kāi)啟history模式 需要這里特殊配置一下
        error_page 405 =200 http://$host$request_uri; # 方式部署完成之后報(bào)405錯(cuò)誤
    }

    # 代理node服務(wù)
    location ~ /api {
        proxy_pass http://127.0.0.1:2019; # node服務(wù)啟動(dòng)的端口
    }

    #error_page  404              /404.html;  //指定錯(cuò)誤頁(yè)面

    # redirect server error pages to the static page /50x.html
    # 把后臺(tái)錯(cuò)誤重定向到靜態(tài)的50x.html頁(yè)面
    error_page   500 502 503 504  /50x.html; 
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    # 代理PHP腳本到80端口上的apache服務(wù)器
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    # 把PHP腳本9000端口上監(jiān)聽(tīng)的FastCGI服務(wù)
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    # 不允許訪問(wèn).htaccess文件
    #location ~ /\.ht {
    #    deny  all;
    #}
}

    配置完之后一定記得重啟nginx

    啟動(dòng)nginx   systemctl start nginx.service
停止nginx   systemctl stop nginx.service
重啟nginx   systemctl restart nginx.service
重新加載配置 systemctl reload nginx.service

  2. pm2管理node服務(wù)

    進(jìn)入Koa2服務(wù)目錄，執(zhí)行啟動(dòng)命令

    pm2 start ./bin/www --watch

    pm2啟動(dòng).png

pm2常用命令

停止node服務(wù) 根據(jù)項(xiàng)目ID停止    pm2 stop 0
停止node服務(wù) 根據(jù)名稱(chēng)停止       pm2 stop www
停止node服務(wù) 根據(jù)js文件停止      pm2 stop ./bin/www

除了第一次啟動(dòng)需要用js文件啟動(dòng)  其余啟動(dòng)都可以根據(jù)ID啟動(dòng)了

設(shè)置開(kāi)機(jī)自啟應(yīng)用

1、保存當(dāng)前進(jìn)程狀態(tài)  pm2 save
2、生成開(kāi)機(jī)自啟命令  pm2 startup
3、保存         pm2 save
pm2 list查看是否成功
pm2開(kāi)機(jī)自啟.png
pm2開(kāi)機(jī)自啟2.png

  1. 到這里一切配置結(jié)束，接下來(lái)打來(lái)瀏覽器看是否可以正常訪問(wèn)

    界面.png
界面2.png

?好了，希望能給大家?guī)?lái)幫助，如果感覺(jué)還可以，麻煩給個(gè)贊！

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容