目录
前言
在本地开发好网站后，只能自己看，如果想要别人也能看到，就需要公网ip并把项目部署到此公网ip的服务器上。一、准备服务器
网上好像有免费的服务器，但是为了节省时间和精力，我没有去研究怎么获取，我直接在阿里云买了。
二、连接宝塔面板
1.用finalshell连接服务器
下载页面： FinalShell SSH工具，我选的是Windows版下载地址。下载安装后按图示操作。如果服务器22端口没开放的话，记得开放，不然会出错，开放端口在第六点。
单击名称连接
2.在服务器安装宝塔
输入 yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh 后按回车。这是Centos的安装命令，其他系统的安装命令见：安装宝塔面板命令
按回车开始安装，安装过程中有需要输入的地方输入y。
安装完成后打开宝塔页面登录。如果服务器8888端口没开放的话，记得开放，不然会出错，开放端口在第六点。
三、上传前后台项目到服务器
1.下载所需软件
我目前的软件是这些
2.上传前台vue项目并配置nginx
在www目录下新建文件夹project，project里面再新建文件夹meme（名称自己定），上传vue打包后生成的dist文件夹到meme。
配置nginx，其中的server_name是服务器公网ip，/www/project/dist是刚刚上传的dist文件的地址。
server{
listen 81;
server_name 47.100.176.197;
location / {
root /www/project/meme/dist;
try_files $uri $uri/ /index.html;
}
}
保存后记得重载配置。
3.上传后台node项目并配置nginx
上传meme-server（node项目里除了node_modules都上传，图片里有是因为我之前在服务器npm i过了，后面会提到）到project目录里
双击index.js文件，打开后查看接口监听端口，此处是8082。
因为我在前台项目是这样调接口的：api("/api/ip",ipdata,‘POST’)，所以在nginx这样配置。意思是我在前台调接口47.100.176.197:81/api/ip，配置nginx后实际调的是http://127.0.0.1:8082/ip
location /api {
rewrite ^/api/(.*)$ /$1 break;
proxy_pass http://127.0.0.1:8082;
}
四、同步mysql数据库到服务器
1.导出本地数据库的表
选择.sql格式
不断点击下一步，最后点击开始按钮导出。
2.在服务器添加数据库
用户名、密码、数据库名称最好跟本地数据库一样，这样在本地测试、上线时不用改来改去。
3.在服务器数据库导入本地的表
打开数据库管理
如果打不开的话把端口改为888，然后用刚刚设置的用户名和密码登录。如果服务器888端口没开放的话，记得开放，不然会出错，开放端口在第六点。
登录后新建数据表，表名一定要跟本地导出的表名相同，不然会报错。
添加字段，跟本地导出的表字段一样
五、在服务器启动node
1.在服务器安装node依赖
打开之前下载的finalshell，连接服务器，输入以下命令。安装后可以到node项目目录（/www/project/meme-server）检查有没有node_modules文件夹。
2.用PM2管理器启动node
填好后提交即可。
六、开放端口
上面用到的端口记得在宝塔面板和服务器防火墙开放
七、域名
做完上面步骤，别人在浏览器输入47.100.176.197:81是可以看到页面的。如果不想通过ip，可以购买一个域名。我是在阿里云跟着步骤来买域名、解析域名的，跟着提示就可以了，这里就不赘述了。
八、成果展示
这两个连接都可以看到我的项目（之前域名没有备案完成，80端口不能用就用了81，现在域名备案好了，就改为80了，也就是默认端口，不用写出来)，上面是我平时爬下来的表情包和头像，我把连接发到微信的文件传输助手，然后在微信打开，再设置成浮窗，聊天要用到表情包时，我直接点击浮窗，再长按图片转发就可以了，相当于我的另一个表情包库了，不用再担心微信表情包存不下啦哈哈。你们也可以试着用用嘻嘻嘻🌻
47.100.176.197
liangziqi.top
总结
在建立网站过程中，我一个前端开发，慢慢摸索后台、数据库、部署，踩了很多坑后得出的这篇文章，希望可以帮到大家。有问题可以私信我，看到秒回??。关于同步数据库那里，我试了很多种方法，就只有这种可以，不知道大家有没有更好的方法，毕竟我这种方法有点麻烦，要一个个表导入。