一、准备工作
1、购买云服务器(我购买的是腾讯云)
(1)腾讯云链接: 登录 - 腾讯云
(2)我购买的是宝塔面板,最简单的轻量服务器;https://console.cloud.tencent.com/lighthouse/instance/index?rid=8
2、使用腾讯云OrcaTerm终端:连接服务器工具
注: 使用root角色,不然有些地方权限不够;
3、安装nginx、mysql、nvm等
(1)安装nginx
参考https://cloud.tencent.com/developer/article/1654844
执行以下命令:
1. cd到根目录: cd /
2. 安装以下依赖
yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel
3、创建一个文件夹
cd /usr/local
mkdir nginx
cd nginx
//下载tar包
wget http://nginx.org/download/nginx-1.13.7.tar.gz
// 解压包
tar -xvf nginx-1.13.7.tar.gz
4、安装nginx
// 进入nginx目录
cd /usr/local/nginx
// 进入目录
cd nginx-1.13.7
// 执行命令
./configure
// 执行make命令
make
// 执行make install命令
make install
// make时候遇到问题的解决方案
https://blog.csdn.net/Mercycpp/article/details/121629994
https://blog.csdn.net/weixin_44065695/article/details/126632836
5、启动nginx服务
/usr/local/nginx/sbin/nginx -s reload
或者
cd /usr/local/nginx/sbin/
启动服务: ./nginx
停止服务: ./nginx -s stop
重启服务:./nginx -s reload
⚠️:执行命令后没有任何信息,就是最好的消息!!!
(2)安装mysql
可以自己百度搜linux安装mysql;
但是我安装mysql失败,最后安装的是mariadb: https://blog.csdn.net/miaodichiyou/article/details/99289160
(3)安装nvm
参考链接:
a.下载nvm包
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash
b.
command -v nvm
c. 设置nvm自动运行
echo "source ~/nvm/nvm.sh" >> ~/.bashrc
source ~/.bashrc
d. 查看node版本: nvm list-remote
e. 安装16版本的node: nvm install v16.14.0
(4)安装pm2
npm install -g pm2
二、部署一个静态页面(hbuildx的h5项目)
(1) 在服务器中建立一个文件夹, 路径如下: mkdir /home/www;
(2) 本地打包前端项目, 打包后将unpackage/dist/build/h5文件夹上传到服务器的 /home/www 文件夹下, 并将h5改名为dist即可;
(3) 修改nginx.conf文件,vim nginx.conf
a. user root; # 修改为root用户, 不修改的话可能页面会出现403 forbidden;
b. 修改server里面的配置
server {
listen 80; // 修改为80端口
server_name xxx; // 修改为你购买的服务器的ip地址
location / {
root /home/www/dist; // 你的前端项目上传到的文件夹路径
try_files $uri $uri/ @router; // 防止刷新页面404
}
//防止刷新页面404
location @router {
rewrite ^.*$ /index.html last;
}
}
(4) 此时应该通过服务器的ip地址访问你的页面了!即http://xxx/
三、部署一个node服务到同一服务器
(1)在服务器中建立一个文件夹, 路径如下: mkdir /home/admin;
(2) 将node项目上传到服务器的 /home/admin 文件夹下
(3) 像在本地运行代码一样,在/home/admin文件夹下执行npm install, 并找到app.js文件,执行node app.js;
(4) 可以重新打开一个终端,执行curl http://xxx/ 看下是否可以访问到node服务;
(5) 在nginx.conf文件中添加以下设置:
location /api/ {
# 我们后端express服务启用的端口是9999,所以这里就转发到这个地址
proxy_pass http://xxx:3000/;
# 下面三句话是用来获取用户访问的ip的
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
}
注: 此时可以在浏览器中访问: http://xxx/api/ 来访问node服务;
这里是通过识别api路径, 来将请求转发到http://xxx:3000/,因此前端请求接口的路径应该是: http://xxx/api/;