记录如何将H5项目部署到服务器实现公网访问

记录如何从0将web项目部署到服务器实现公网https访问

源码准备

• 已编译打包好的uniapp项目
• 将H5项目文件push到gitee远程仓库
• 拿到远程仓库的SSH地址（供后面直接在服务器获取源码使用，这里不再阐述如何使用SSH协议操作仓库）

域名、证书准备

• 登录腾讯云的DNSPOD控制台 --域名解析 --我的域名
• 选择一个域名
• 添加子域名解析记录(根据需要设置的网站地址设置）
• 点击解析记录的SSL并申请免费证书(这里填写的证书绑定域名需要填写实际用户访问的域名全写）
• 下载保存证书（选择nginx证书）到本地并解压
• 拿到解压后的证书文件备用

服务器准备

• 登录腾讯云服务器
• 使用docker下载nginx镜像
• 部署一个项目用来分发公网流量到各个子项目
• 将拿到的证书文件放到/home/ubuntu/programs/nginx/conf/cert里
• 修改/home/ubuntu/programs/nginx/conf/conf/nginx.conf文件（修改流量转发配置）
• 修改完成后进入/home/ubuntu/programs/当前项目
• :wq（退出并保存）
• 进入项目根目录/home/ubuntu/programs/xzwm_business
• 新建文件夹 nginx
• 进入文件夹nginx
• 新建文件夹conf
• 进入文件夹conf
• 新建文件nginx.conf并配置如下内容（由于是使用nginx流量代理分发的形式、这里配置比较简单）

worker_processes  1;

error_log  /var/log/nginx/error.log;
error_log  /var/log/nginx/error.log  notice;
error_log  /var/log/nginx/error.log  info;

pid        /var/log/nginx/nginx.pid;

events {
    multi_accept on;            #设置一个进程是否同时接受多个网络连接，默认为off
    worker_connections  1024;   #最大链接数
}

http {
        include       mime.types;                       #文件扩展名与文件类型映射
        default_type  application/octet-stream; #默认文件类型，默认值为text/plain
        access_log    /var/log/nginx/access.log;
        sendfile      on;
        server {
                server_name localhost;
                listen      80;

                location / {
                        root /usr/share/nginx/project;
                        index   index.html index.htm;
                        try_files $uri $uri/ /index.html last;
                }
        }
}

• 退出文件夹conf
• 新建文件夹project（存放编译后的项目源码）
• 新建文件夹log（用于映射到docker容器内存放项目日志）
• 退出当前文件夹nginx
• 在当前文件夹下（项目根目录）下执行如下命令（使用nginx镜像新建一个docker容器并对其进行命名和文件夹映射）

docker run --name xzwm_business -itd -v $PWD/nginx/conf/nginx.conf:/etc/nginx/nginx.conf -v $PWD/nginx/project:/usr/share/nginx/project -v $PWD/nginx/log:/var/log/nginx --net=xn_network nginx

• 使用git命令

	# 从仓库克隆源码到本地
	git clone git@gitee.com:wei-liang-zhao/xzwm_business.git

• 将克隆后的文件名修改为data
• 新建一个文件upWeb.sh，放入如下代码

cd data;
git pull origin master;
cd ..;
cp -r data/unpackage/dist/build/h5/* nginx/project;
docker restart xzwm_business;

• 在当前目录（项目根目录）执行upWeb.sh脚本
• 如果首次部署项目在执行完upWeb.sh后别忘记重启一下路由容器哈！

docker restart xn

大功告成，可以直接在公网使用域名访问这个项目了！