# 宝塔部署

# 1、安装宝塔

进入宝塔官网 (opens new window),根据你当前的系统安装。以centos为例:

安装命令

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

一路选Y,漫长的等待之后,控制台会打印出宝塔的地址,访问该地址:

WARNING

有些云服务商例如:阿里云,还需要配置安全组,允许相对应的端口才能访问。宝塔端口默认是8888

# 2、安装环境

(1)点击宝塔左侧菜单软件商店, 安装nginxmysql两个服务,等待安装完成

  • nginx: 前端静态资源及服务端反向代理
  • mysql: 数据库
  • redis(可选): 缓存服务

(2)等待服务安装完成,点击宝塔左侧菜单数据库,新建一个数据库。

WARNING

数据库编码建议选择utf8mb4否则无法存储emoji等字符,如果需要远程连接数据库,访问权限选择所有人。 安装完数据库之后需要导入数据库,服务端只有在start的情况下不会自动初始化数据库。

(3)安装node,点击宝塔左侧菜单软件商店,安装Node.js版本管理器,安装完对应版本之后选择命令行版本registry源,如图所示

# 3、编译代码

(1)编译后端代码,编译之前得先修改下数据库配置,生产环境的数据库配置位于config/config.prod.ts

config.orm = {
    type: 'mysql',
    host: '127.0.0.1', // 服务器内部
    port: 3306,
    username: 'cool',
    password: 'JEfff7kCtYLXJJ7D',
    database: 'cool',
    // 自动建表 注意:线上部署的时候不要使用,有可能导致数据丢失
    synchronize: true,
    // 打印日志
    logging: true,
    // 字符集
    charset: 'utf8mb4',
  };

执行命令

npm run build

编译完将distpackage.json上传到服务器/home/cool/server(路径可以自己定义)

WARNING

注意:package.json放在与dist同级。

/home/cool/server启动服务

npm install
npm run start

// 成功后执行,有返回欢迎页则启动成功
curl 'http://127.0.0.1:8001' 

(2)编译前端

执行命令

npm run build

# 新建网站

(1)点击宝塔左侧菜单网站,新建一个网站

(2)修改配置

添加如下配置

    # 防止刷新404
    location / {
      try_files $uri $uri/ /index.html;
    }
    
    # 代理服务端地址  访问/api 表示访问服务端接口而不是静态资源
    location /api/ 
    {
        proxy_pass http://127.0.0.1:8001/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
        
        proxy_cache_bypass no_cache;
        
        #缓存相关配置
        #proxy_cache cache_one;
        #proxy_cache_key $host$request_uri$is_args$args;
        #proxy_cache_valid 200 304 301 302 1h;
        
        #持久化连接相关配置
        proxy_connect_timeout 3000s;
        proxy_read_timeout 86400s;
        proxy_send_timeout 3000s;
        #proxy_http_version 1.1;
        #proxy_set_header Upgrade $http_upgrade;
        #proxy_set_header Connection "upgrade";
        
        add_header X-Cache $upstream_cache_status;
        
        #expires 12h;
    }

完整配置

server
{
    listen 80;
    server_name test.cool-js.com;
    index index.php index.html index.htm default.php default.htm default.html;
    root /home/cool/front;
    
    #SSL-START SSL相关配置,请勿删除或修改下一行带注释的404规则
    #error_page 404/404.html;
    #SSL-END
    
    #ERROR-PAGE-START  错误页配置,可以注释、删除或修改
    #error_page 404 /404.html;
    #error_page 502 /502.html;
    #ERROR-PAGE-END
    
    #PHP-INFO-START  PHP引用配置,可以注释或修改
    include enable-php-00.conf;
    #PHP-INFO-END
    
    #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效
    include /www/server/panel/vhost/rewrite/test.cool-js.com.conf;
    #REWRITE-END
    
    location / {
      try_files $uri $uri/ /index.html;
    }
    
    location /api/ 
    {
        proxy_pass http://127.0.0.1:9001/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
        
        proxy_cache_bypass no_cache;
        
        #缓存相关配置
        #proxy_cache cache_one;
        #proxy_cache_key $host$request_uri$is_args$args;
        #proxy_cache_valid 200 304 301 302 1h;
        
        #持久化连接相关配置
        proxy_connect_timeout 3000s;
        proxy_read_timeout 86400s;
        proxy_send_timeout 3000s;
        #proxy_http_version 1.1;
        #proxy_set_header Upgrade $http_upgrade;
        #proxy_set_header Connection "upgrade";
        
        add_header X-Cache $upstream_cache_status;
        
        #expires 12h;
    }
    
    #禁止访问的文件或目录
    location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)
    {
        return 404;
    }
    
    #一键申请SSL证书验证目录相关设置
    location ~ \.well-known{
        allow all;
    }
    
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    {
        expires      30d;
        error_log /dev/null;
        access_log /dev/null;
    }
    
    location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log /dev/null;
        access_log /dev/null; 
    }
    access_log  /www/wwwlogs/test.cool-js.com.log;
    error_log  /www/wwwlogs/test.cool-js.com.error.log;
}

# docker部署

可以查看李栋的视频教程 (opens new window),感谢李栋精心录制