返回

初涉江湖：我的第一次Vue-NodeJS-MongoDB项目服务器部署记录

前端

缘起：初次尝试

作为一个初出茅庐的程序员，我一直对项目部署充满着憧憬。而这次，我终于迎来了自己第一次真正的项目部署经历。

项目介绍

这次要部署的项目是一个名为“师大Buy”的校园闲置交易平台。这是一个基于Vue.js、Node.js和MongoDB构建的项目，旨在为师范大学的学生提供一个安全、便捷的闲置物品交易平台。

准备工作

在开始部署之前，我做了很多准备工作。

1. 服务器的选择

首先，我需要选择一个合适的服务器。经过比较，我最终选择了阿里云的云服务器ECS。阿里云的云服务器不仅性价比高，而且还有很多优惠活动。

2. 环境的搭建

在服务器上，我搭建了必要的环境。包括：

  • 操作系统：CentOS 7
  • Node.js：v16.14.2
  • MongoDB：v5.0
  • Vue.js：v3.2.33

3. 项目的打包

在本地，我将项目打包成了一个dist文件夹。这个文件夹包含了项目的所有静态资源和构建好的JavaScript代码。

部署过程

准备好一切之后，我开始部署项目。

1. 上传项目代码

我将项目代码上传到了服务器的/var/www/html目录下。

2. 安装依赖

在服务器上，我安装了项目所需的依赖。

cd /var/www/html
npm install

3. 配置Nginx

我使用Nginx作为项目的Web服务器。我修改了Nginx的配置文件，使其能够正确地代理请求到项目所在的目录。

4. 启动项目

我启动了项目。

npm run serve

5. 访问项目

在浏览器中，我输入了项目的域名。项目成功地运行了起来。

遇到的问题

在部署过程中，我遇到了很多问题。

1. 端口占用

在启动项目时，我遇到了端口占用问题。原来，服务器上的80端口已经被另一个程序占用了。我修改了项目的端口，问题解决。

2. CORS错误

在访问项目时，我遇到了CORS错误。这是因为我的项目与服务器不在同一个域名下。我修改了Nginx的配置文件，添加了CORS头，问题解决。

3. SSL证书错误

在使用HTTPS访问项目时，我遇到了SSL证书错误。这是因为我没有为项目配置SSL证书。我购买了SSL证书，并将其安装到了服务器上，问题解决。

最终结果

经过一番折腾，我终于成功地部署了项目。项目运行正常，可以正常访问。

总结

通过这次部署经历，我学到了很多东西。我不仅了解了项目部署的整个流程，还学会了如何解决部署过程中遇到的问题。我相信，这些经验对我的未来发展非常有帮助。

附录

项目链接