使用宝塔面板部署前后端项目到腾讯云服务器

前言

写这篇文章的初衷单纯为了记录一下的全栈项目部署线上的全过程以及遇到的一些问题和解决方法。

前期准备

首先购买个云服务器，至于域名购买不购买也无关紧要，从0到1操作一遍，至少有点前后端以及数据库的基本知识储备。
项目声明:
这个项目主要组合方式：

• 前端：React;
• 后端：Koa2;
• 数据库：MongoDB

工欲善其事必先利其器之工具

• 堡塔ssh远程终端 （部署项目工具）
• MongoDB客户端（数据操作）
• 安装个Apifox插件（用来测试接口）

堡塔面板安装以及常用操作

堡塔下载界面下载：如图所示客户端

安装宝塔并获取网页版面板入下链接
云服务器界面 注意：镜像选择CentOS
宝塔最常用指令：bt 输入对应的标号进行对应的操作 注释：如果忘记网页的链接用户名等信息可以输入编号14查看，其他就不一一赘述了

添加服务如图所示

堡塔网页界面

堡塔导航列表：红色框内常用部分

• 网站部分：主要用来上传前后端程序；
• 数据库：对数据库的操作部分；
• 文件：主要查看程序存放的位置；
• 软件商店：软件下载区； 以上模块也是部署程序所需功能模块；

前端项目部署

后端项目部署

数据的操作

问题汇总

• 部署成功后访问不到数据库

解决：把链接数据库的地址改写成：

/** 注释说明
* mongodb://用户名:密码@域名:端口号/数据库名
* 密码可以修改
**/
const mongoUrl='mongodb://test_koa:abc123456@49.235.105.78:27017/test_koa'

• 关于使用pm2 node项目启动失败以及解决方法

解决：注释：运行用户把www改成root
宝塔面板数据库导入数据失败以及解决方案以及查看数据库是否创建成功
使用mongodb客户端创建一个数据路径例如

/** 注释说明
* mongodb://用户名:密码@域名:端口号/数据库名
**/
mongodb://test_koa:abc1123456@49.235.105.78:27017/test_koa

建立连接进入数据库后，在数据库中创建一个空的表然后在空表中导入对应的数据表
注释:数据库的表名后要加s 例如 hot 表名为hots

导入成功后在宝塔的面板中mongodb数据库的工具可以查看导入后的表

关于前端项目打包代理中间件失效以及解决方法

使用http-proxy-middleware 做代理打包后失效

    #文件 setupProxy.js
    const {createProxyMiddleware} = require("http-proxy-middleware");
        module.exports = function(app){
            app.use(
                createProxyMiddleware("/api",{
                    target:'http://http://localhost:3000',
                    changeOrigin:true,
                    pathRewrite:{
                    "^/api":""
                    }
                })
            )
        }

直接在nginx的配置文件中加入

总结

以上就是使用宝塔面板，把本地开发的项目部署到云服务器上的完整过程以及此过程中遇到的问题以及解决方法。