腾讯云服务器买了后怎么部署Java项目和前端页面

买了腾讯云服务器之后,最常遇到的问题不是怎么用,而是怎么把自己的项目真正跑起来。尤其是当你写了一个Java后端,又配了个Vue做的前端页面,到底该怎么把它们一起部署到服务器上,并且能通过网址访问?下面我们就从零开始,一步一步来走完这个过程,不跳步骤,不省略细节。

先搞清楚你的项目结构是啥样的

在动手之前,得先确认你手里的项目到底长什么样。大多数情况下,你可能有一个用Spring Boot写的Java项目,打包后是个jar文件;前端是Vue写的,运行后会生成一堆静态文件(、CSS、JS)。我们要做的,就是让后端服务跑在服务器上,同时让Nginx去托管前端页面,并把接口请求转发给后端。

这整个流程听起来复杂,其实就三步:准备服务器环境、上传并运行Java项目、部署前端静态资源并配置反向代理。

第一步:登录服务器,把基本环境搭起来

买好腾讯云服务器后,你会有一个公网IP地址、用户名(一般是root)和密码。接下来我们要通过SSH工具连接到这台机器。Windows用户可以用MobaXterm或Xshell,Mac和Linux直接用终端就行。

  1. 打开你的SSH工具,新建一个会话,填入服务器的公网IP,端口一般是22,用户名填root,然后输入密码登录。
  2. 登录成功后,你就进入了服务器的命令行界面,可以开始敲命令了。

现在我们先检查一下系统信息,确认是什么操作系统:

cat /etc/os-release

假设你用的是CentOS 7或者CentOS Stream这类系统,接下来我们要装几个必要的软件:JDK和Nginx。

安装Java运行环境(JDK)

Java项目要运行,必须要有JDK。我们可以用系统自带的包管理器来装。比如在CentOS上,可以用yum命令安装OpenJDK 11:

yum install -y java-11-openjdk-devel

安装完成后,验证一下是否成功:

java -version

如果看到输出了Java版本信息,说明JDK已经装好了。这时候你的服务器就可以运行jar包了。

安装Nginx用来托管前端页面

前端页面是一堆静态文件,需要用Web服务器来提供访问服务。最常用的就是Nginx。我们继续用yum来安装:

yum install -y nginx

安装完后启动Nginx:

systemctl start nginx

设置开机自启:

systemctl enable nginx

这时候你在浏览器里输入http://你的服务器公网IP,应该能看到Nginx的欢迎页面。说明Web服务已经跑起来了。

第二步:上传并运行你的Java后端项目

现在环境有了,下一步就是把你的Java项目传到服务器上。假设你在本地已经用Maven或者Gradle把项目打包成了一个jar文件,比如叫myapp.jar

把jar包传到服务器

你可以用SSH工具自带的SFTP功能来上传文件。以MobaXterm为例,连接服务器后,左边会有一个文件浏览器,你可以直接把本地的jar文件拖进去,放到/root目录下就行。

传完之后,在命令行里进入对应目录:

cd /root

运行Java项目

现在就可以用java -jar命令来启动你的应用了:

nohup java -jar myapp.jar --server.port=8080 > app.log 2>&1 &

这里解释一下这条命令:

  • nohup:让程序在你关闭SSH连接后还能继续运行。
  • --server.port=8080:指定项目运行在8080端口,你可以根据需要改。
  • > app.log 2>&1:把日志输出到app.log文件,方便后续排查问题。
  • &:后台运行,不阻塞终端。

运行后,可以用下面这个命令查看进程是否启动成功:

ps aux | grep myapp.jar

如果你在本地测试过接口,比如/api/user/list,现在可以在服务器上用curl命令测一下:

curl http://localhost:8080/api/user/list

如果返回了正确的JSON数据,说明后端服务已经在服务器上正常工作了。

第三步:部署Vue前端项目并配置Nginx反向代理

前端这边,假设你已经用npm run build把Vue项目打包好了,生成了一个dist文件夹,里面全是静态资源。

上传前端构建结果

同样用SFTP工具,把dist文件夹整个传到服务器的/root目录下。

然后把它移动到Nginx的默认网站根目录:

mv /root/dist/ /usr/share/nginx//

这时候你刷新一下http://你的服务器公网IP,应该就能看到你的前端页面了。但你会发现,页面上的请求还是连不到后端,因为接口地址可能还是指向本地的localhost:8080,而浏览器是不允许跨域访问的。

配置Nginx反向代理解决跨域问题

解决办法就是让Nginx来当“中间人”,把所有/api开头的请求,自动转发到后端的8080端口。这样前端和后端看起来就像在同一域名下,也就没有跨域问题了。

编辑Nginx的配置文件:

vi /etc/nginx/nginx.conf

找到server块里的location /部分,在它下面添加一个新的location规则:


location /api {
proxy_pass http://127.0.0.1:8080;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

保存退出(在vi里按Esc,输入:wq回车)。

然后重新加载Nginx配置:

nginx -s reload

现在再打开你的前端页面,点击任何需要调用后端接口的功能,比如登录、加载列表,应该都能正常返回数据了。因为所有/api/xxx的请求都被Nginx自动转到了8080端口的Java服务上。

第四步:开放服务器端口,让外部能访问

虽然服务在服务器上跑起来了,但外网不一定能访问。这是因为腾讯云有一层“安全组”防火墙,默认只开放了22(SSH)和80(HTTP)端口。

如果你的Java项目用了8080端口,就必须去控制台手动放行。

  1. 登录腾讯云控制台,进入云服务器实例页面。
  2. 找到你这台服务器,点击“更多” -> “管理”。
  3. 在左侧菜单里找到“安全组”,点击进入。
  4. 点击“添加规则”,在“端口”栏输入8080,策略选“允许”,备注可以写“Java应用端口”。
  5. 保存后,等待几秒钟生效。

这时候你就可以在任何地方的浏览器里输入http://你的服务器公网IP访问你的前端页面,所有功能都应该正常工作了。

进阶操作:用宝塔面板简化部署流程(可选)

上面全是命令行操作,对新手来说可能有点难记。如果你更喜欢图形化界面,可以用宝塔面板来管理服务器。

宝塔是一个免费的服务器管理工具,装上后你就能通过网页来管理文件、数据库、网站、防火墙等。

安装宝塔面板

在服务器命令行执行官方安装命令(以CentOS为例):

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

安装完成后,会打印出一个登录地址、用户名和密码。你用浏览器打开那个地址,就能进入宝塔后台。

在宝塔里部署项目

登录宝塔后,你可以:

  • 在“软件商店”安装JDK、Nginx、MySQL等环境。
  • 用“文件”功能上传jar包和dist文件夹。
  • 用“网站”功能创建站点,指定目录为/www/wwwroot/myproject
  • 用“安全”功能一键开放8080端口。
  • 用“计划任务”设置jar包开机自启。

整个过程几乎不用敲命令,适合不想碰终端的新手用户。

常见问题和排查方法

部署过程中可能会遇到一些问题,下面列出几个最常见的,并给出解决思路。

问题现象 可能原因 解决方法
页面打不开,显示无法连接 安全组没开80端口 去控制台安全组添加80端口放行规则
前端页面能打开,但接口404或超时 后端没启动或端口没开 检查jar是否在运行,确认8080端口已开放
上传文件失败 磁盘空间不足 df -h查看空间,清理无用文件
Nginx配置修改后不生效 没重载配置 执行nginx -s reload或重启Nginx

遇到问题别慌,先用systemctl status nginxps aux | grep java看看服务状态,再查日志文件,比如app.log/var/log/nginx/error.log,基本都能定位到原因。

总结一下关键步骤

整个部署流程其实并不复杂,核心就是四个环节:

  1. 连接服务器:用SSH登录,准备好操作环境。
  2. 安装运行环境:装JDK和Nginx,确保能跑Java和托管静态页面。
  3. 上传并启动项目:把jar包和前端文件传上去,用nohup和Nginx分别启动。
  4. 配置网络访问:开放安全组端口,设置反向代理,让外网能正常访问。

只要按这个顺序一步步来,即使你是第一次接触云服务器,也能把自己的Java+Vue项目成功上线。

如果你想快速开始部署自己的项目,可以先去了解一下 腾讯云服务器,选择适合的配置开启你的应用部署之旅。

未经允许不得转载: 本文基于人工智能技术撰写,整合公开技术资料及厂商官方信息,力求确保内容的时效性与客观性。建议您将文中信息作为决策参考,并以各云厂商官方页面的最新公告为准。云服务商优惠信息实时变动,本文内容仅供参考,最终价格请以官方活动页面公示为准。便宜云服务器优惠推荐 & 建站教程-服务器优惠推荐 » 腾讯云服务器买了后怎么部署Java项目和前端页面