记录一下自己从买服务器到部署的历程
一、云服务器
云服务购买
可以在腾讯云和阿里云上面搜索云服务器,然后购买自己需要的云服务器,我买的是1核2G的 ubuntu server 公网宽带选的1M
买好后 自己试一下连接自己的服务器 在cmd里输入
- windows上要ssh 没有的话需要自己安装openSSH
- 我在阿里云上买的服务器,刚开始没有设置实例密码,连接之前得先去实例那里设置密码才能连接
ssh 用户名@公网IP 回车 输入密码
域名购买
在域名选择那里,输入自己想要的域名,是否被注册,没有注册的话就可以购买
购买了域名需要备案 大概30天左右
解析域名
在域名列表那里 进行解析设置 解析到我们的服务器上(要实名制审核通过后才能进行域名解析 备案后我们的域名才能访问)
对应的域名那里点击解析 添加记录 添加进我们自己的公网IP地址
备案 (还没开始弄 后面再记录)
现在暂时不用域名访问 先直接用公网IP测试,等后面备案好后再使用域名
申请SSL证书(小程序需要https协议才能访问)
普通域名只要申请SSL证书就可以使用https
找到阿里云
https://yundun.console.aliyun.com
选择免费证书
一年有20个免费证书
申请免费证书 要填写自己的域名 (域名没有解析成功 ssl证书配置不成功)
证书颁发也需要一到两天的时间
证书颁发成功 点击下载
下载后把nginx的证书传到云服务器上nginx目录下 创建ssl文件夹
注意:阿里云服务器默认开放3389端口和22端口 要想访问其他端口需要自己配置安全组才能访问
二、在服务器上安装Nginx Node mp2
登录云服务器
ssh 用户名@公网IP 回车 密码
登录成功后会显示welcome to …
安装node.js
下载安装包 默认下载到当前路径下https://nodejs.org/zh-cn/download/
wget https://nodejs.org/dist/v14.16.0/node-v14.16.0-linux-x64.tar.xz
ls // 查看当前目录下文件 看看是否已经下载了下来
执行以下命令,解压Node.js的安装包
tar -xvf node-v14.16.0-linux-x64.tar.xz
执行以下命令,重命名Node.js安装目录(就是把解压后的文件换一个地方放)
mv node-v14.16.0-linux-x64/ /usr/local/node
// 需要注意是不是把整个node-v14.16.0-linux-x64目录放在了node下 我们需要的是把里面的东西放在node下 之前我没注意就是把整个目录放进去了,node启动不起来,结果找了半天原因
配置Node.js
执行以下命令,将Node.js的可执行文件目录加入到系统变量中
echo "export PATH=$PATH:/usr/local/node/bin" >> /etc/profile
执行以下命令,使刚配置的Node.js环境变量立即生效
source /etc/profile
// 分别查看node和npm版本
node -v
npm -v
安装淘宝源
npm install -g cnpm --registry=https://registry.npm.taobao.org
ubantu安装Nginx
sudo apt-get install nginx
nginx -v
whereis nginx // 可以查看安装路径
// 最好在root根目录下输入这个命令
sudo /etc/init.d/nginx start //开启nginx // stop停止 // restart // reload
// 在/etc/nginx/sites-available/default里面修改配置
// 修改的时候 记得备份一份 备份default文件
sudo cp /etc/nginx/sites-available/default /etc/nginx/sites-available/default.backup
nginx -t // 试运行一下看修改过后的配置是否有问题 没有问题就重启
sudo /etc/init.d/nginx relaod //修改配置后重启
注意:nginx默认打开的是80端口,而我们自己的服务器没有默认开放80端口,所以我们要在配置文件(deafult)里把80端口修改为自己需要的端口号
// 查看有哪些nginx进程
ps -ef | grep nginx // ps -ef 查看进程 grep是过滤 只看nginx的进程
// 查看nginx进程的pid
ps -C nginx -o pid
安装PM2
npm install -g pm2
使用pm2启动服务
pm2 start app.js
三、部署
使用node服务
在服务器上创建一个文件夹如server
cd server
npm init
npm i koa koa-static --save-dev
把vue打包好的dist文件夹放在server文件夹下面
创建app.js 输入一下内容
const koa = require('koa')
const app =new koa();
const static = require('koa-static')
const path = require('path')
app.use(static(path.join(__dirname,'/dist'),{
setHeaders:function(res,path,stats){
}
}))
app.use(async (ctx,next) => {
try {
await next()
} catch (error) {
ctx.response.status = err.statusCode || err.status || 500;
ctx.response.body = {
message:err.message
}
}
})
app.listen(8009)
console.log('my app启动 端口号:8009')
修改package.json文件 在scripts里面添加"start": “node app.js”
在server目录下运行node npm run start 访问公网IP:8009就可以了
使用nginx
启动nginx
sudo /etc/init.d/nginx start
修改配置文件/etc/nginx/sites-available/default
把
listen 80 default_server;
listen [::]:80 default_server;
改为
listen 8009 default_server;
listen [::]:8009 default_server;
把 root /var/www/html; 路径改为自己项目的路径
如 root /etc/server/dist;
如果需要跨域做反向代理,需要添加location
假如需要把192.168.1.1:80/authorApi/getCode请求重定向为为1.1.1.1:80/getCode
location /authorApi {
rewrite ^/authorApi/(.*)$ /$1 break; // 必须写rewrite 不然不生效
proxy_pass http://1.1.1.1:80; # 后端接口 IP:port
}
注意 location /authorApi 需要加在localtion / 前面 且前端访问接口要把http://1.1.1.1:80/…改为192.168.1.1:80/authorApi/…
修改后配置后,查看配置是否有误 nginx -t ;没有就重启nginx
然后就直接使用公网IP:8009就可以使用了
使用docker上的nginx部署前端项目
docker run --rm --name ksh -p 8009:80 -d -v /usr/local/visual/nginx:/etc/nginx/ -v /usr/local/visual/web/html/:/usr/share/nginx/html nginx
/*
docker run --rm // -rm 停掉这个ksh nginx就删除掉
--name ksh
-p 8009:80 //端口8009
-d -v /usr/local/visual/nginx:/etc/nginx/ // 把nginx配置映射给nginx容器
-v /usr/local/visual/web/html/:/usr/share/nginx/html // 把自己的源码映射到nginx容器里
nginx
*/
docker ps //查看docker正在运行哪些容器
docker ps -a //查看dockers里面有哪些容器包括已经停止的
docker stop ksh //停止ksh这个容器
docker pull nginx //下载nginx
docker images // 查看docker 镜像
/*
注意:
当docker运行nginx时,外界访问还是docker所在的那个IP地址,就相当于nginx在那台机器上运行一样。
但对于docker所在的那台机器来说,nginx就是附属于docker的一个镜像。若操作nginx还是由docker登录nginx容器,进行操作。
登录的nginx容器就是一个linux系统,只不过只有nginx而已,nginx按照linux默认路径安装。比如
root@c0462d5e1878:/usr/share/nginx/html# ls 这个路径就是默认的静态页面存放路径
50x.html index.html
*/
// 可以直接把需要的文件写好直接放在容器指定的目录下,但这样比较麻烦,还是想之前那样做映射比较好 修改起来不用进入容器改代码 直接在容器外面改代码就可以了 并且容器里面没有安装vim 还是更新再安装vim很麻烦
// docker cp 用于容器与主机之间的数据拷贝
docker cp hello.html c0462d5e1878(容器id):/usr/share/nginx/html
//这样就会显示hello.html里面的内容
docker exec -it c0462d5e1878 bash // 进入容器
// 刚开始我们没有nginx文件 我们可以把默认容器里面的nginx复制出来,再映射,这样改nginx的时候方便
tar -zcvf nginx.tar.gz nginx
exit // 退出容器
docker cp c0462d5e1878(容器id):/etc/nginx.tar.gz /usr/local/visual
tar -zxvf nginx.tar.gz
rm -rf nginx.tar.gz //删除压缩包
default.conf
location / {
# 使用history模式
try_files $uri $uri/ /index.html; #去掉就是hash 模式
root /usr/share/nginx/html/dist;
index index.html index.htm;
}