uniapp-ruoyi-spring部署宝塔

宝塔的安装不多说了，

就是需要一个指令查看密码，接下来就是uniapp转网页部署

没啥好说的，主要问题在于跨域，跨域，前端做了一部分，后端也做了一部分。具体的是

项目	内容说明
跨域的定义	浏览器出于安全策略（同源策略），禁止网页向不同源的服务器发送请求。不同源指协议、域名或端口有任意一个不同。
同源策略	由浏览器实现，用于隔离潜在恶意网站。规定：只有同源的脚本才能读取当前页面的 Cookie、本地存储、DOM 等资源。
为什么需要跨域	前端页面与后端 API 不在同一域名或端口下部署时（如前端在 http://localhost:8080，后端在 http://8.130.97.8:7777），请求被浏览器拦截。为允许合法访问，需要跨域配置。
常见跨域场景	前后端分离部署、微服务架构、API 网关代理、第三方接口调用等。
跨域原理	浏览器在发送请求前会先发送一个"预检请求"（OPTIONS 方法），询问服务器是否允许该源访问。服务器若在响应头中返回允许字段，浏览器才会发送正式请求。
关键响应头	- Access-Control-Allow-Origin: 指定允许访问的源（如 * 或具体域名） - Access-Control-Allow-Methods: 允许的请求方法（GET, POST, PUT...） - Access-Control-Allow-Headers: 允许的请求头 - Access-Control-Allow-Credentials: 是否允许携带 Cookie
Nginx 解决方案原理	通过在 Nginx 反向代理层添加响应头，将跨域权限下发给前端浏览器，绕开浏览器限制。
Nginx 示例配置	nginx<br>location /api/ {<br> proxy_pass http://127.0.0.1:7777/;<br> add_header Access-Control-Allow-Origin *;<br> add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';<br> add_header Access-Control-Allow-Headers 'Content-Type,Authorization';<br> if ($request_method = 'OPTIONS') {<br> return 204;<br> }<br>}<br>
安全注意点	- 生产环境中不建议使用 *，应指定明确域名。 - 如需携带 Cookie，必须设置：Access-Control-Allow-Origin 为具体域名，且 Access-Control-Allow-Credentials: true。
总结	跨域问题本质是浏览器安全限制。Nginx、后端代码或网关都可通过添加 CORS 响应头授权跨域访问。

反向代理（Reverse Proxy）是服务器端代理模式。客户端访问代理服务器，由代理服务器转发请求给后端真实服务器，再将响应结果返回给客户端。客户端不知道真实服务器的存在。

功能类别	Nginx 的具体作用	技术说明
请求接收	接收来自浏览器的 HTTP 请求	浏览器访问 Nginx（同源），请求被 Nginx 捕获，不直接到后端。
请求转发	使用 proxy_pass 将请求转发给后端服务器	例如：proxy_pass http://127.0.0.1:7777/ 把前端 /api/ 请求转到 Spring Boot。
响应回传	接收后端返回结果并传回给客户端	浏览器认为响应来自 Nginx（同源），因此不会触发跨域。
头部重写	添加或修改 HTTP 头	如 add_header Access-Control-Allow-Origin *; 添加跨域许可头。
路径映射	修改 URL 路径结构	可将 /api/user → /user，隐藏后端路径。
安全隔离	隐藏后端真实 IP 与端口	提高系统安全性，外网只暴露 Nginx。
负载均衡	将请求分发到多台后端服务器	通过 upstream 实现简单或加权轮询分配。
缓存与压缩	缓存静态资源、压缩响应内容	提升访问速度和性能。
跨域处理	添加 CORS 响应头实现跨域访问	通过 Nginx 层面控制跨域而无需修改后端代码。

阶段	动作	说明
1. 浏览器发起请求	用户访问 http://8.130.97.8/api/bottle/pick	请求首先到达 Nginx 监听的端口（如 80）。
2. Nginx 匹配规则	根据配置文件匹配 location /api/	找到该路径对应的转发目标。
3. 构造新请求	Nginx 生成一个新的 HTTP 请求	将原始请求的路径、参数、头部信息复制或修改后，内部发送到指定后端。
4. 转发至后端	Nginx 与后端服务器通信	通常通过本机网络（如 127.0.0.1:7777）发起连接，浏览器无法看到此通信。
5. 后端处理请求	后端应用（如 Spring Boot）执行逻辑并返回结果	生成响应数据（如 JSON）。
6. Nginx 接收响应	Nginx 充当中间层接收后端响应	可在此阶段增加或修改响应头。
7. 返回给浏览器	Nginx 将响应发回给客户端	浏览器以为响应来自 8.130.97.8，未察觉转发过程。

Nginx 在网络层完成转发，不需要任何前端或后端代码参与。

对浏览器而言，请求与响应始终来自同一个源。

对后端而言，请求来源是 Nginx，不是外部客户端。

uniapp

发行打包html，上传文件，nginx转发

    # 添加到server块内
location /api/ {
    proxy_pass http://127.0.0.1:9090/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header REMOTE-HOST $remote_addr;
    add_header X-Cache $upstream_cache_status;
    proxy_connect_timeout 30s;
    proxy_read_timeout 86400s;
    proxy_send_timeout 30s;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
}

请求网址

http://8.130.97.8/api/bottle/pick -》http://127.0.0.1:9090/bottle/pick

服务器

maven打包上传，修改数据库账号密码，一气呵成

项目启动命令
nohup /www/server/java/jdk-18.0.2.1/bin/java -Xmx1024M -Xms256M -jar /www/wwwroot/default/h/Java-0.0.1-SNAPSHOT.jar > /www/wwwroot/default/javahtml/logs/java.log 2>&1 &
​

增加日志-取的控制台

ruoyi

spring

sudo mkdir -p /home/ruoyi/logs
sudo chown -R ruoyi:ruoyi /home/ruoyi/logs
sudo chmod -R 755 /home/ruoyi/logs
ruoyi部署问题

sudo mkdir -p /home/ruoyi/logs

sudo chmod -R 777 /home/ruoyi/logs

一气呵成，注意日志文件没有的问题

ruoyi前端

打包。php项目

不然老是404

        location /prod-api/{
      proxy_set_header Host $http_host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header REMOTE-HOST $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_pass http://localhost:8080/;       #后台项目的运行端口
    }

必须php

现在还是一样没懂

但是完成了就好