很多人项目能在本地跑起来，但一到“上线”就懵了：代码传到哪里？命令在哪输入？Nginx 到底改哪里？哪些配置在服务器改，哪些在项目里改？

这篇就讲一套最常见、也最适合新手入门的方式：

云服务器 + Linux + Nginx + 前后端分离项目

这套方案不花哨，但很常见，很多公司都会接触到。先把这个学会，再学 Docker、K8s 会轻松很多。

一、上线到底是在做什么

简单说，就是把你本地的项目，放到一台公网服务器上，让别人通过 IP 或 域名 访问。

一般会分成这几步：

1. 买一台云服务器

2. 连接到服务器

3. 安装项目运行环境

4. 把前端和后端代码上传到服务器

5. 启动后端服务

6. 用 Nginx 配置前端访问和接口转发

7. 绑定域名、放行端口

二、安装基础环境是为什么

因为服务器刚买来时，通常只有一个基础系统，不能直接跑你的项目。

你需要按项目类型安装对应环境：

• 前端页面要能被 Nginx 提供访问

• Java 项目要安装 JDK

• Node 项目要安装 Node.js

• Python 项目要安装 Python

• 如果项目要连数据库，还要准备 MySQL 或其他数据库

你可以把它理解成：本地电脑能跑，是因为你电脑已经有这些环境；服务器也一样，必须先装好。

三、这些命令到底在哪输入

这是新手最容易混的地方。

1. 本地电脑里输入的命令

比如这些：

npm run build

这是在你自己的电脑里输入，用来把前端项目打包。

2. 服务器里输入的命令

比如这些：

sudo apt install nginx -y
nohup java -jar app.jar &

这是先通过 SSH 连上服务器后，再在服务器终端里输入。

也就是说：

• 本地终端：负责打包、上传文件

• 服务器终端：负责安装环境、启动项目、改 Nginx

四、前端和后端代码怎么放到服务器上

这是上线里最实际的一步。

1. 先在本地准备好文件

前端

先在本地项目目录执行：

npm run build

执行后一般会生成一个 dist 文件夹，这就是要上传到服务器的前端文件。

后端

按你的项目类型准备：

• Java：打成 jar

• Node.js：准备项目源码和 package.json

• Python：准备源码和 requirements.txt

2. 再把文件上传到服务器

你可以用两种常见方式。

方式一：用工具上传

适合新手：

• FinalShell

• Xshell + Xftp

• MobaXterm

连接服务器后，直接把文件拖到服务器目录里，比如：

/home/project

方式二：用命令上传

如果你会命令行，也可以本地执行：

scp -r dist root@服务器IP:/home/project/frontend
scp -r backend root@服务器IP:/home/project/backend

意思是：

• 把本地 dist 上传到服务器 /home/project/frontend

• 把后端代码上传到服务器 /home/project/backend

五、服务器上一般放成什么结构

推荐这样放：

/home/project
  /frontend
  /backend

• frontend：放前端打包后的静态文件

• backend：放后端代码或运行包

这样目录清楚，后面配置 Nginx 也方便。

六、Nginx 在哪里配置，后端配置又改哪里

这个也很重要，很多人会混。

1. Nginx 配置

Nginx 是服务器软件，所以它的配置文件改的是服务器里的文件，不是在你的前端项目里改。

常见位置：

/etc/nginx/nginx.conf

或者：

/etc/nginx/sites-available/default

也就是说，Nginx 配置是在服务器上改。

2. 后端项目配置

后端端口、数据库地址、账号密码这类配置，一般在你后端项目自己的配置文件里改，比如：

• Java：application.yml 或 application.properties

• Node.js：.env

• Python：项目配置文件或环境变量

也就是说：

• 域名访问、接口转发：改 Nginx

• 端口、数据库、业务配置：改后端项目配置

七、最常见的一套实际部署流程

1. 买 Linux 服务器

新手建议直接买云服务器，系统选：

Ubuntu 22.04

2. 连接服务器

本地终端输入：

ssh root@你的服务器IP

连上以后，你后面输入的 Linux 命令，都是在服务器里执行。

3. 安装基础环境

服务器里输入：

sudo apt update
sudo apt install nginx -y

如果后端是 Java：

sudo apt install openjdk-17-jdk -y

如果后端是 Node.js：

sudo apt install nodejs npm -y

4. 上传前端和后端代码

把文件传到：

/home/project/frontend
/home/project/backend

5. 启动后端

如果是 Java：

cd /home/project/backend
nohup java -jar app.jar > app.log 2>&1 &

如果是 Node.js：

cd /home/project/backend
npm install
nohup npm run start > app.log 2>&1 &

假设后端跑在 8080 端口。

6. 配置 Nginx

在服务器里编辑 Nginx 配置文件：

sudo vim /etc/nginx/sites-available/default

示例：

server {
    listen 80;
    server_name 你的域名或服务器IP;
​
    location / {
        root /home/project/frontend;
        index index.html;
        try_files $uri $uri/ /index.html;
    }
​
    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;
    }
}

它的作用是：

• 打开网站时，先访问前端页面

• 当前端请求 /api 时，Nginx 再转发给后端

改完后执行：

sudo nginx -t
sudo systemctl restart nginx

7. 放行端口

你至少要放行：

• 22：远程连接服务器

• 80：HTTP 访问网站

• 443：HTTPS 访问网站

如果云服务器安全组没开，项目即使已经启动，外网也访问不到。

八、公司里真的只会用这种简单方式吗

小公司、内部系统、测试环境，或者简单业务项目，确实经常会用这种方式。

因为它的优点很明显：

• 成本低

• 部署快

• 容易排查问题

• 新手容易上手

但公司不一定永远只用这一种。

等你把这套学熟后，可以继续学习这些更常见的进阶方式：

• Docker：把环境和项目一起打包，减少“我电脑能跑，服务器不能跑”

• Docker Compose：同时管理前端、后端、数据库、Redis

• Jenkins / GitLab CI：自动化部署

• Kubernetes（K8s）：适合更复杂、更大规模的服务管理

• CDN + 对象存储：专门托管前端静态资源

九、新手最该先学会什么

不要一开始就扑进 Docker 和 K8s。

先把下面这件事独立做通：

本地打包 -> 上传服务器 -> 启动后端 -> 配置 Nginx -> 外网访问成功

只要这条链路你走通一次，你就已经真正理解“项目上线”了。

十、总结

对于新手来说，最适合先学会的部署方式就是：

Linux 服务器 + 上传项目文件 + 启动后端 + Nginx 反向代理

它不是最高级的方案，但它足够常见，也足够实用。先把这套学会，再去学 Docker、自动化部署、K8s，思路会清楚很多。