使用 spa-to-http 创建零配置的SPA HTTP服务器

使用 spa-to-http 创建零配置的SPA HTTP服务器

spa-to-http Lightweight zero-configuration SPA HTTP server. Serves SPA bundle on HTTP port so it plays well with Traefik out of the box. Compatible with Vue.js, React and Angular 项目地址: https://gitcode.com/gh_mirrors/sp/spa-to-http

1. 项目介绍

spa-to-http 是一个轻量级、零配置的 Single Page Application (SPA) HTTP 服务器。它专为与 Traefik 或 CDN 服务等反向代理配合使用而设计。该项目使用 Go 语言编写，因此具有启动快速、性能优越和资源占用小的特点。它支持 Vue.js、React、Angular 等流行的单页应用框架，并且默认支持 Brotli 压缩。

2. 项目快速启动

以下是在 Docker 容器中快速启动 spa-to-http 的步骤：

首先，在你的单页应用目录中创建一个 Dockerfile：

FROM node:20-alpine as builder
WORKDIR /code/
ADD package-lock.json .
ADD package.json .
RUN npm ci
ADD . .
RUN npm run build

FROM devforth/spa-to-http:latest
COPY --from=builder /code/dist/ .

然后，构建并运行 Docker 容器：

docker build -t spa-http-server .
docker run -d -p 8080:8080 spa-http-server

这样，你的单页应用就会在容器中启动并监听 8080 端口。

3. 应用案例和最佳实践

3.1 集成 Traefik

以下是使用 Traefik 和 Docker Compose 集成 spa-to-http 的示例：

version: "3.3"
services:
  traefik:
    image: "traefik:v2.7"
    command:
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entrypoints.web.address=:80"
    ports:
      - "80:80"
    volumes:
      - "/var/run/docker.sock:/var/run/docker.sock:ro"

  spa-service:
    build: "spa" # 指向包含 Dockerfile 的目录
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.spa-service.rule=Host(`spa-service.localhost`)"
      - "traefik.http.services.spa-service.loadbalancer.server.port=8080"

3.2 启用 Brotli 压缩

要在 spa-to-http 中启用 Brotli 压缩，可以在 Docker Compose 文件中添加以下命令：

command: --brotli

3.3 自定义端口

如果你需要将服务运行在自定义端口上，可以调整 Docker Compose 文件中的端口映射和命令：

command: --brotli --port 8082
- "traefik.http.services.spa-service.loadbalancer.server.port=8082"

3.4 忽略缓存控制

对于某些特定资源，例如服务工作者 (/sw.js)，可能需要禁用缓存。可以在 Docker Compose 文件中添加以下命令：

command: --ignore-cache-control-paths "/sw.js"

4. 典型生态项目

spa-to-http 可以与多种工具和框架无缝集成，以下是一些典型的生态项目：

• Traefik: 一个开源的反向代理和负载均衡器，可以轻松集成 spa-to-http。
• Webpack/Vite: 常用的前端构建工具，生成的单页应用可以直接由 spa-to-http 服务器提供。
• CDN 服务: 内容分发网络服务，与 spa-to-http 一起使用可以提供快速的全球内容分发。

通过以上最佳实践，你可以快速搭建并运行一个高效的SPA HTTP服务器。

spa-to-http Lightweight zero-configuration SPA HTTP server. Serves SPA bundle on HTTP port so it plays well with Traefik out of the box. Compatible with Vue.js, React and Angular 项目地址: https://gitcode.com/gh_mirrors/sp/spa-to-http