部署 | Free FS

1. Nginx 部署

将打包生成的 dist 目录上传到服务器，并使用 Nginx 进行托管。

server {
    listen 80;
    server_name your-frontend-domain.com;

    location / {
        root /path/to/your/dist;
        index index.html;
        try_files $uri $uri/ /index.html;
    }

    # 代理后端接口（注意：路径前缀是 /apis）
    location /apis/ {
        proxy_pass http://localhost:8080/apis/;
        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 X-Forwarded-Proto $scheme;
    }
}

2. Docker 部署

项目提供了 docker/Dockerfile，镜像内置 Nginx，无需手动打包，容器启动后直接通过 Nginx 对外提供服务。

前提条件

Docker >= 20.10
后端服务已启动并可访问

快速开始

以下命令均在项目根目录下执行，将 http://your-api:8080 替换为你的实际后端地址。

# 1. 构建镜像
docker build -f docker/Dockerfile -t free-fs-frontend .

# 2. 启动容器
docker run -d -p 80:80 \
  -e API_BASE_URL=http://your-api:8080 \
  --name free-fs-frontend \
  free-fs-frontend

启动后访问 http://localhost 即可。

环境变量说明

变量	用途	传入时机	是否必填
`API_BASE_URL`	Nginx 反向代理目标地址，将 `/apis/` 请求转发到此地址	`docker run -e`	是
`VITE_API_BASE_URL`	前端 JS 中的 API 地址	`docker build --build-arg`	否
`VITE_API_VIEW_URL`	前端 JS 中的文件预览地址	`docker build --build-arg`	否

说明：VITE_API_BASE_URL 和 VITE_API_VIEW_URL 默认为空，前端会使用相对路径 /apis/... 经由 Nginx 代理转发到后端。如果构建时通过 --build-arg 传入了完整地址，浏览器将直接请求该地址，不再经过 Nginx。

自定义端口

docker run -d -p 3000:80 \
  -e API_BASE_URL=http://your-api:8080 \
  --name free-fs-frontend \
  free-fs-frontend

构建时指定 API 地址

docker build -f docker/Dockerfile \
  --build-arg VITE_API_BASE_URL=http://your-api:8080 \
  --build-arg VITE_API_VIEW_URL=http://your-api:8080 \
  -t free-fs-frontend .

常用容器命令

# 查看日志
docker logs -f free-fs-frontend

# 停止容器
docker stop free-fs-frontend

# 重启容器
docker restart free-fs-frontend

# 删除容器
docker rm -f free-fs-frontend

常见问题

Q: 页面打开后接口 404？

检查 API_BASE_URL 是否正确指向后端服务。若前后端在同一台机器上，不要使用 localhost，应使用宿主机 IP 或 Docker 网络名称。

Q: 刷新页面 404？

正常情况不会出现，Nginx 已配置 SPA fallback。如果出现，请检查 Nginx 配置是否正确加载。

Q: 上传大文件失败？

Nginx 已配置 client_max_body_size 0（不限制），若仍然失败请检查后端的上传大小限制。