博客網站項目部署問題彙總

時間 2019-11-13

原文原文鏈接

最近在使用koa2+mysql+nodejs+weback+vue+redis技術搭建了一個博客網站，奈何遇到了種種問題，如今一一總結一番：css

問題1. 使用 ecosystem.json 配置文件部署項目， "post-deploy" : "npm install && pm2 startOrRestart ecosystem.json --env production", //項目發佈到服務器上執行的命令 vue

發現按照教程或者網絡給出的配置文件，沒法訪問網站，網站報nginx代理問題，或者直接502 Bad Gateway；node

打印 pm2 的日誌：mysql

發現服務貌似一直被 killed 而後在喚起，而後在killed。。。。。webpack

問題2.因而修改配置文件，懷疑是執行命令的問題：nginx

"post-deploy" : "npm install &&npm run prd &&pm2 startOrRestart ecosystem.json --env production", //項目發佈到服務器上執行的命令

注意這裏多了 npm run prd，對應的package.json 文件中的命令：git

"prd": "cross-env NODE_ENV=production pm2 start bin/www --watch",

即讓服務啓動的命令，而後頁面就能訪問了，可是會有幾個問題：github

　　問題：在服務端使用pm2 ls 會發如今原來myblog進程上多了一個www的進程：web

相似如上圖所示，固然這個是正確以後的圖，實際上這裏會多一行 name爲www的進程，實際上這個進程就是執行 npm run prd 後起的進程。redis

相似的在服務器端的 www/website/myblog/current文件夾中執行npm run prd 一樣會起這個服務，而後進程也是www；

好了，即便咱們使用npm run prd喚起了服務，可是仍有如下問題：

　　問題1：網站引用的js、css等靜態資源沒法緩存；

　　問題2: 每次執行部署代碼命令 pm2 deploy ecosystem.json production ，都會提示服務器正在運行該進程【即npm run prd】，每次都要在服務器關閉該進程再執行該命令，或者加上-f命令，卻致使進程數過多。

　　問題3：最爲致命的是，網站在運行半天以後，只能訪問靜態css、js等資源，koa腳手架搭建的api接口所有不能訪問了！！！！！

------------

那麼問題究竟在哪裏呢？

折騰了好久，對pm2配置文件各類修改嘗試，還有nginx的配置文件，甚至從新格式化磁盤，從新搭建環境，都不行。。。。。

直到在一次服務器又不能訪問api接口後，我打印pm2日誌看了一下：

納尼？？？報了一個錯誤：loveNum未定義，而後在看下面的日誌：

因錯誤太多，致使服務器掛了。。。。掛了。。。。。。

終於明白了，原來是自己邏輯有問題，代碼沒法獲取到loveNum的值，剛開始還能夠運行，可是時間過長以後，愈來愈多的錯誤致使服務卡死，因而表現爲往往運行半天左右，接口就掛了。

好了，直到緣由後，排查業務邏輯代碼，修改loveNum的bug，而後在ecosystem.json 配置文件中，刪掉npm run prd；而且修改 "script": "./bin/www",//啓動的入口腳本，最終ecosystem.json 配置文件以下：

{
  "apps":[{
    "name": "myblog", //部署的應用的名字
    "script": "./bin/www",//啓動的入口腳本
    "watch":true,//是否監聽文件發生變化
    "env": {
      "COMMON_VARIABLE": "true"//啓動時傳入的變量
    },
    // Environment variables injected when starting with --env production
    // http://pm2.keymetrics.io/docs/usage/application-declaration/#switching-to-different-environments
    "env_production" : {
      "NODE_ENV": "production" //生產環境的變量
    }
  }],
  // Deployment part
  // Here you describe each environment
  "deploy" : { //部署的任務
    "production" : {
      "user" : "zyl", //服務器上用來發布的用戶名
      // Multi host is possible, just by passing IPs/hostname as an array
      "host" : ["39.106.194.136"],//主機ip
　　　　"port":"22",//端口號
// Branch
      "ref"  : "origin/master", //指定主分支master
      // Git repository to clone
      "repo" : "git@github.com:zhenyulei/koa-blog.git", //倉庫地址
      // Path of the application on target servers
      "path" : "/home/zyl/www/website/myblog", //把項目部署到服務器的那個目錄下
      // Can be used to give options in the format used in the configura-
      // tion file.  This is useful for specifying options for which there
      // is no separate command-line flag, see 'man ssh'
      // can be either a single string or an array of strings
      "ssh_options": "StrictHostKeyChecking=no", //把ssh的key校驗取消掉
      // To prepare the host by installing required software (eg: git)
      // even before the setup process starts
      // can be multiple commands separated by the character ";"
      // or path to a script on your local machine
      "pre-setup" : "",
      // Commands / path to a script on the host machine
      // This will be executed on the host after cloning the repository
      // eg: placing configurations in the shared dir etc
      "post-setup": "ls -la",
      // Commands to execute locally (on the same machine you deploy things)
      // Can be multiple commands separated by the character ";"
      "pre-deploy-local" : "echo 'This is a local executed command'",
      // Commands to be executed on the server after the repo has been cloned
      "post-deploy" : "npm install && pm2 startOrRestart ecosystem.json --env production", //項目發佈到服務器上執行的命令
// Environment variables that must be injected in all applications on this env 
      "env" : { "NODE_ENV": "production" } } }
}

再次執行：

pm2 deploy ecosystem.json production setup 

pm2 deploy ecosystem.json production

binggo！！網站終於可以訪問了！

不但解決了網站可以訪問的問題，並且網站的靜態資源也有了緩存，此外再來看pm2的ls

在看其日誌，已經正常：

終於好了。

---

其餘問題，在設置服務器緩存的時候，發現

其中conf.d 是設置nginx路由對應關係的文件夾，而nginx.conf是設置nginx中的http的配置文件。

因此設置緩存和壓縮應該是放在nginx.conf文件中設置。

此外，加上favicon.icon：使用webpack打包的單頁面項目如何設置favicon.icon文件

最簡單的方法是在koa端直接放在public文件夾中，注意名字必定要標準：favicon.icon

upstream myblog {
    server 127.0.0.1:8000;
}
server {
    listen 80;
    server_name www.blog.xiaozhumaopao.com;
    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forward-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-Nginx-Proxy true;
        proxy_set_header X-Forwarded-Host $server_name;

        proxy_pass http://myblog;
        proxy_redirect off;
    }

    location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|js|pdf|txt){
      root /home/zyl/www/website/myblog/current/public;
    }

}