如何用 Apache 反向代理缓存搭建 HTTP/3 服务并加速 Vite 应用的 QUIC 传输？

在典型的 Web 部署中，Vite 负责生成优化后的静态资源，而 Apache 承担对外服务与缓存职责。将两者结合并启用 HTTP/3，可以让浏览器通过 QUIC 建立更快的连接，同时利用 Apache 缓存降低后端压力。下面从 Apache 的 HTTP/3 开启方式讲起，逐步完成代理缓存配置，再讨论 Vite 生产与开发环境中的具体优化。

HTTP/3 在 Apache 中的启用与工作原理

HTTP/3 不再使用 TCP，而是建立在 QUIC 协议之上。QUIC 基于 UDP 实现了多路复用、连接迁移和 0-RTT 握手，因此在高丢包或高延迟网络下，页面资源加载的首字节时间可以得到明显改善。Apache 从 2.4.53 版本开始提供实验性的 HTTP/3 支持，核心模块为 mod_http3，依赖 ngtcp2 和 nghttp3 库。编译 Apache 时需要显式启用该模块，如果使用 Linux 发行版提供的包，需确认包中是否包含 mod_http3。

启用 HTTP/3 的第一步是加载模块并监听 UDP 的 443 端口。QUIC 要求使用 TLS 1.3，因此必须为虚拟主机配置有效证书。接着需要设置 Alt-Svc 响应头，告知客户端该站点支持 HTTP/3，浏览器在首次通过 HTTP/2 或 HTTP/1.1 访问后会尝试升级到 QUIC。下面是一段典型的 Apache 虚拟主机配置：

LoadModule http3_module modules/mod_http3.so
LoadModule h2_module modules/mod_h2.so
LoadModule ssl_module modules/mod_ssl.so

Listen 443 http3
Listen 443 ssl

<VirtualHost *:443>
    ServerName ipipp.com
    Protocols h3 h2 http/1.1
    SSLEngine on
    SSLCertificateFile /etc/ssl/certs/ipipp.com.crt
    SSLCertificateKeyFile /etc/ssl/private/ipipp.com.key
    Header always set Alt-Svc 'h3=":443"; ma=86400'
</VirtualHost>

上面的配置中，Protocols h3 h2 http/1.1 表示优先协商 HTTP/3，若客户端不支持则回退到 HTTP/2 或 HTTP/1.1。Alt-Svc 头中的 ma=86400 表示该替代服务信息的有效期为一天。需要注意的是，防火墙必须放行 UDP 443 端口，否则 QUIC 报文无法到达服务器。另外，某些云负载均衡器可能只转发 TCP，需要检查上游链路是否支持 UDP。

完成配置后重启 Apache，使用 curl --http3 命令可以测试 HTTP/3 是否生效。如果 curl 不支持该选项，可以安装支持 HTTP/3 的构建版本。浏览器中打开开发者工具的 Network 面板，在协议列看到 h3 即表示连接已通过 QUIC 建立。

用 mod_proxy 与 mod_cache 构建面向 Vite 的缓存代理

Vite 生产构建会输出一个 dist 目录，其中 index.html 作为入口文件，assets 下的 JavaScript、CSS 等资源均带有内容哈希。例如 assets/index-a1b2c3.js，只要文件内容不变，哈希就不会变化。这一特性非常适合长缓存策略：可以把带哈希的资源缓存一年甚至更久，而 index.html 需要保持短缓存或禁用缓存，以便应用发布新版本时浏览器能立即获取到新的入口文件。

如果 Vite 应用部署在同一台服务器上，可以直接让 Apache 的 DocumentRoot 指向 dist 目录。但如果希望 Apache 作为反向代理，将请求转发到后端 Node.js 服务或对象存储，就需要使用 mod_proxy。以下配置展示了反向代理到本机 5173 端口的场景，同时开启磁盘缓存：

LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_http_module modules/mod_proxy_http.so
LoadModule cache_module modules/mod_cache.so
LoadModule cache_disk_module modules/mod_cache_disk.so
LoadModule expires_module modules/mod_expires.so
LoadModule headers_module modules/mod_headers.so

<VirtualHost *:443>
    ServerName ipipp.com
    Protocols h3 h2 http/1.1
    SSLEngine on
    SSLCertificateFile /etc/ssl/certs/ipipp.com.crt
    SSLCertificateKeyFile /etc/ssl/private/ipipp.com.key
    Header always set Alt-Svc 'h3=":443"; ma=86400'

    ProxyPreserveHost On
    ProxyPass / http://127.0.0.1:5173/
    ProxyPassReverse / http://127.0.0.1:5173/

    CacheRoot /var/cache/apache2/mod_cache_disk
    CacheEnable disk /
    CacheDirLevels 2
    CacheDirLength 1
    CacheDefaultExpire 3600
    CacheMaxExpire 86400
    CacheIgnoreNoLastMod On
    CacheQuickHandler Off

    <LocationMatch "^/assets/.*\.(js|css|png|jpg|svg|woff2?)$">
        Header set Cache-Control "public, max-age=31536000, immutable"
        ExpiresActive On
        ExpiresDefault "access plus 1 year"
    </LocationMatch>

    <LocationMatch "^/index\.html$">
        Header set Cache-Control "no-cache, no-store, must-revalidate"
        ExpiresActive On
        ExpiresDefault "access plus 0 seconds"
    </LocationMatch>
</VirtualHost>

上述配置中，CacheEnable disk / 开启了对所有路径的磁盘缓存，但通过 LocationMatch 规则，对 assets 下带哈希的资源设置了长达一年的缓存时间，并加上 immutable 标记，告诉浏览器在缓存有效期内不要重新验证。而对于 index.html 则强制不缓存，确保发布新版本后客户端能拿到最新的入口文件。这样便兼顾了加载性能和更新及时性。

需要特别注意的是，反向代理场景下若后端返回的响应头包含 Set-Cookie，缓存模块默认可能不缓存。此时可以配合 Header unset Set-Cookie 或者调整缓存策略。此外，mod_cache 对包含 Vary: * 的响应也不会缓存。检查后端 Vite 或 Node.js 服务是否返回了不合适的头部，必要时在 Apache 中增加 Header unset Vary 或规范化处理。

针对 Vite 开发模式与生产模式的 QUIC 优化实践

Vite 开发服务器本身基于 Node.js 的 http 模块，默认不支持 HTTP/3。如果强行把 Apache 的 HTTP/3 代理到开发服务器，浏览器与 Apache 之间走 QUIC，但 Apache 到 Vite 开发服务器仍然使用 HTTP/1.1。由于开发模式重度依赖 WebSocket 实现热模块替换（HMR），而 HTTP/3 的 WebSocket 支持目前仍不完善，容易导致断连或升级失败。因此，开发模式下更推荐直接通过 Vite 自身的 HTTP/1.1 服务访问，或者使用 Apache 的 HTTP/2 代理，而不需要启用 HTTP/3。

生产环境中则没有 HMR 的顾虑。Vite 构建完成后，所有资源都是静态文件，完全由 Apache 提供。此时启用 HTTP/3 可以发挥最大优势：移动网络下连接建立更快，多路复用避免了队头阻塞，配合长缓存策略，二次访问几乎可以零请求。为了进一步提升性能，可以在 Apache 中开启 Brotli 或 gzip 压缩，但要注意压缩后的缓存键会包含 Accept-Encoding 变动，需要正确配置 Vary 头。常见的做法是让 mod_deflate 在压缩时自动添加 Vary: Accept-Encoding，缓存模块也能依据该头存储多个版本。

若要验证优化效果，可以使用浏览器的 Performance 面板记录首屏加载时间，对比启用 HTTP/3 前后的差异。同一台机器上，不同协议协商会影响连接建立耗时，尤其在往返时间较长的网络下，HTTP/3 的 0-RTT 特性可以节省一到两个往返。此外，Apache 的访问日志可以记录协议信息，在 CustomLog 中使用 %p 变量可输出协议版本，帮助统计 h3 连接占比。

常见问题排查方面，如果 HTTP/3 始终未生效，首先确认 Apache 配置中 Protocols 是否包含 h3，其次检查 UDP 443 端口是否被防火墙拦截，最后查看浏览器是否因为之前失败的 QUIC 尝试而暂时禁用了该主机。可以使用 quic 相关命令行工具或在 Chrome 中打开 chrome://net-internals/#quic 查看会话状态。逐步排除后，大多数部署都能顺利启用 HTTP/3。

Apache代理缓存HTTP/3Vite修改时间：2026-09-18 18:48:26