很多人项目能在本地跑起来但一到“上线”就懵了代码传到哪里命令在哪输入Nginx 到底改哪里哪些配置在服务器改哪些在项目里改这篇就讲一套最常见、也最适合新手入门的方式云服务器 Linux Nginx 前后端分离项目这套方案不花哨但很常见很多公司都会接触到。先把这个学会再学 Docker、K8s 会轻松很多。一、上线到底是在做什么简单说就是把你本地的项目放到一台公网服务器上让别人通过IP或域名访问。一般会分成这几步买一台云服务器连接到服务器安装项目运行环境把前端和后端代码上传到服务器启动后端服务用 Nginx 配置前端访问和接口转发绑定域名、放行端口二、安装基础环境是为什么因为服务器刚买来时通常只有一个基础系统不能直接跑你的项目。你需要按项目类型安装对应环境前端页面要能被 Nginx 提供访问Java 项目要安装 JDKNode 项目要安装 Node.jsPython 项目要安装 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打成jarNode.js准备项目源码和package.jsonPython准备源码和requirements.txt2. 再把文件上传到服务器你可以用两种常见方式。方式一用工具上传适合新手FinalShellXshell XftpMobaXterm连接服务器后直接把文件拖到服务器目录里比如/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 /backendfrontend放前端打包后的静态文件backend放后端代码或运行包这样目录清楚后面配置 Nginx 也方便。六、Nginx 在哪里配置后端配置又改哪里这个也很重要很多人会混。1. Nginx 配置Nginx 是服务器软件所以它的配置文件改的是服务器里的文件不是在你的前端项目里改。常见位置/etc/nginx/nginx.conf或者/etc/nginx/sites-available/default也就是说Nginx 配置是在服务器上改。2. 后端项目配置后端端口、数据库地址、账号密码这类配置一般在你后端项目自己的配置文件里改比如Javaapplication.yml或application.propertiesNode.js.envPython项目配置文件或环境变量也就是说域名访问、接口转发改 Nginx端口、数据库、业务配置改后端项目配置七、最常见的一套实际部署流程1. 买 Linux 服务器新手建议直接买云服务器系统选Ubuntu 22.042. 连接服务器本地终端输入ssh root你的服务器IP连上以后你后面输入的 Linux 命令都是在服务器里执行。3. 安装基础环境服务器里输入sudo apt update sudo apt install nginx -y如果后端是 Javasudo apt install openjdk-17-jdk -y如果后端是 Node.jssudo apt install nodejs npm -y4. 上传前端和后端代码把文件传到/home/project/frontend /home/project/backend5. 启动后端如果是 Javacd /home/project/backend nohup java -jar app.jar app.log 21 如果是 Node.jscd /home/project/backend npm install nohup npm run start app.log 21 假设后端跑在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 nginx7. 放行端口你至少要放行22远程连接服务器80HTTP 访问网站443HTTPS 访问网站如果云服务器安全组没开项目即使已经启动外网也访问不到。八、公司里真的只会用这种简单方式吗小公司、内部系统、测试环境或者简单业务项目确实经常会用这种方式。因为它的优点很明显成本低部署快容易排查问题新手容易上手但公司不一定永远只用这一种。等你把这套学熟后可以继续学习这些更常见的进阶方式Docker把环境和项目一起打包减少“我电脑能跑服务器不能跑”Docker Compose同时管理前端、后端、数据库、RedisJenkins / GitLab CI自动化部署KubernetesK8s适合更复杂、更大规模的服务管理CDN 对象存储专门托管前端静态资源九、新手最该先学会什么不要一开始就扑进 Docker 和 K8s。先把下面这件事独立做通本地打包 - 上传服务器 - 启动后端 - 配置 Nginx - 外网访问成功只要这条链路你走通一次你就已经真正理解“项目上线”了。十、总结对于新手来说最适合先学会的部署方式就是Linux 服务器 上传项目文件 启动后端 Nginx 反向代理它不是最高级的方案但它足够常见也足够实用。先把这套学会再去学 Docker、自动化部署、K8s思路会清楚很多。