静态页面部署

本文共--字 阅读约--分钟 | 浏览: -- Last Updated: 2022-07-07

安装配置Nginx

# 安装 nginx 
yum install nginx -y

启动nginx

nginx

服务器目录如下：

data
  - www
    - blog
      - js
        - index.html
      - css
        - index.html

修改nginx配置 /etc/nginx/nginx.conf

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

include /usr/share/nginx/modules/*.conf;

events {
  worker_connections 1024;
}

http {
  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;

  sendfile            on;
  tcp_nopush          on;
  tcp_nodelay         on;
  keepalive_timeout   65;
  types_hash_max_size 2048;

  include             /etc/nginx/mime.types;
  default_type        application/octet-stream;

  include /etc/nginx/conf.d/*.conf;

  server {
    listen       80;
    listen       [::]:80;
    server_name  www.upcccz.cn;
    root         /data/www;

    include /etc/nginx/default.d/*.conf;

    location /blog/ {
      alias /data/www/blog/;
    }
    
    location / {
      alias /data/www/blog/index/;
    }

    error_page 404 /404.html;
      location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
      location = /50x.html {
    }
  }

  # 开启gzip
  gzip on;

  # 启用gzip压缩的最小文件；小于设置值的文件将不会被压缩
  gzip_min_length 1k;

  # gzip 压缩级别 1-10
  gzip_comp_level 2;

  # 进行压缩的文件类型。
  gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png application/json;

  # 是否在http header中添加Vary: Accept-Encoding，建议开启
  gzip_vary on;
}

重启nginx服务

# 测试配置格式是否正确
nginx -t

# 重启
nginx -s reload

创建web文件目录

mkdir -p /data/www

通过scp上传文件,except连接服务器完成部署

配置scp

配置scp以做到本地上传文件到服务器无需输入密码

本地生成ssh

ssh-keygen -t rsa

在本地可以 查看是否生成生成id_rsa 和 id_rsa.pub

cd ~/.ssh
ls

成功生成后，将其拷贝到 服务器根目录/root/.ssh/authorized_keys文件中，这一次需要输入密码，之后就不需要了

前面的root@192.168.0.1为服务器账户和服务器ip

scp .ssh/id_rsa.pub root@192.168.0.1:/root/.ssh/authorized_keys

上传文件到服务器 （将本目录的zip 上传到 服务器的 /data 文件夹）

scp ./blog.zip root@192.168.0.1:/data

编写项目打包通过scp上传文件的脚本

项目结构如下

myblog
 - js-blog
   - xxx.js
   - public
   - xxx.csss

在 myblog 下新建 deploy.sh

#!/bin/bash

params=""
space=" "

for dir in $*
do
  params=${params}${space}${dir}
  cd $dir-blog
  hugo
  cd public
  zip -q -r ../$dir-blog.zip *
  cd ..
  scp ./$dir-blog.zip root@你的公网ip:/data
  rm -f $dir-blog.zip
  cd ..
  echo "upload $dir packages successfully"
done

expect ~/.ssh/web_update$params

# 这一些列的命令是将hugo博客项目打包，压缩，通过scp传到服务器上得到data目录
# 做完之后，执行一个本地脚本~/.ssh/web_update  去连上服务器解压文件，这个脚本下面会提到

# 如果执行的的是 sh deploy.sh js 
# 则相当于执行  expect ~/.ssh/web_update js

# 如果是多个参数就是： sh deploy.sh aa bb cc
# 则相当于执行  expect ~/.ssh/web_update aa bb cc

编写本地登录服务器，并执行服务器上的web文件更新脚本

增加 ~/.ssh/web_update 脚本

# 切换目录
cd ~/.ssh

# 新建文件
touch web_update

# 编写
vim web_update

脚本如下，注释可删掉，中文部分用相关信息代替。

#!/usr/bin/expect -f

# for循环遍历参数
# for {set i 0} {$i < $argc} {incr i} {
#   puts "arg $i: [lindex $argv $i]"
# }

# 设置变量
set host 你的服务器ip
set user 你的服务器账户
set password 你的服务器密码
#set timeout -1

# 登录服务器
spawn ssh $user@$host

expect {
  "(yes/no)?" {
    send "yes\r";
    expect "password:";
    send "${password}\r";
    exp_continue;
  }
  "password:" {
    send "${password}\r";
    exp_continue;
  }
}

# 执行更新脚本 这一步的脚本也可以放在服务器上，而不用放在这里
for {set i 0} {$i < $argc} {incr i} {
  send "rm -rf /data/www/[lindex $argv $i]-blog/*\r"
  expect "#"
  send "unzip -q /data/[lindex $argv $i]-blog.zip -d /data/www/blog/[lindex $argv $i]"
  expect "#"
  puts "depoly [lindex $argv $i] successfully"
}

# 执行更新脚本后，退出服务器终端
send "exit\r"
expect eof

编写服务器上的web文件更新脚本

也可以在服务器上部署更新脚本如下

for dir in $*
do
  rm -rf /data/www/$dir-blog/*
  unzip -q /data/$dir-blog.zip -d /data/www/$dir-blog
  echo "depoly $dir success"
done

关于 vim 异常操作之后的问题

解决操作文件时提示Found a swap file by the name “xxxxxx.swp"的问题

实际上就是之前操作过"xxxxxx.swp"文件，只不过操作不当，没有保存该文件，就会有一个后缀为.swp的隐藏文件存在了，并且这个隐藏文件会在我们下次操作正常的文件名时会提示，会使操作者很厌烦。所以我们要做的就是把xxxxxx.swp删除掉。先按住:q退出当前文件。 然后我们先进入有问题的文件所在的文件夹中，执行ls -a查看所有文件，包括隐藏文件(.swp文件是隐藏文件)

然后再执行rm .nginx.conf.swp删除该文件，最后通过ls -a查看该文件确实被删除了

nginx配置访问nodejs接口

1、centos安装node

# cd /opt/ 目录下

# 安装 gcc gcc-c++
yum install gcc gcc-c++

# 下载node文件 必须是linux-x64
wget https://npm.taobao.org/mirrors/node/v16.15.0/node-v16.15.0-linux-x64.t  ar.gz

# 解压
tar -xvf node-v16.15.0-linux-x64.tar.gz

#重命名
mv node-v16.15.0-linux-x64 node

# 建立软连接
ln -s -i /opt/node/bin/node /usr/bin/node
ln -s -i /opt/node/bin/npm /usr/bin/npm

在nginx中更改配置

# 增加以下配置
location /api/abc {
  proxy_pass http://localhost:9999; # 9999是node listen 的端口号
}

# 则访问 www.yoursite.cn/api/abc 会将程序交给启动服务在端口9999 nodejs处理
# 查看进程 ps -ef | grep node
# 杀进程 kill -9 9999

安装 pm2，使用pm2启动服务后可关闭终端窗口。

npm i -g pm2
ln -s -i /opt/node/bin/pm2 /usr/bin/pm2

# 启动服务
pm2 start index.js

nest打包不会将依赖打进去

nest build 生成dist目录

将package.json 和 yarn.lock 文件拷贝到 dist目录中， 并将dist传到服务器中

拷贝的过程可以使用 postbuild 脚本来实现，run build的时候会按顺序执行 prebuild build postbuild

{
  "scripts": {
    "prebuild": "rimraf dist",
    "build": "nest build",
    "postbuild": "sh cp.sh",
  }
}

# cp.sh
cp yarn.lock ./dist/yarn.lock
cp package.json ./dist/package.json

在服务器安装 yarn

npm i -g yarn 

# 建立软连接
ln -s -i /opt/node/bin/yarn /usr/bin/yarn

# 切换到服务器中上传过来的的dist目录
yarn install --prod