如何启用和配置HTTP/2？

以下是在 Nginx 中启用和配置 HTTP/2 的完整指南，涵盖基础配置、性能优化、与 SSL 的协同配置，以及常见问题排查：

---

1. 基础启用步骤

1.1 修改 Nginx 监听端口

在 Nginx 的 server 块中，将 listen 指令添加 http2 参数：

server {
    listen 443 ssl http2;  # 关键：在 443 端口启用 HTTP/2
    server_name your-domain.com;

    # SSL 证书配置（HTTP/2 必须依赖 HTTPS）
    ssl_certificate /etc/letsencrypt/live/your-domain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/your-domain.com/privkey.pem;
    # ... 其他 SSL 配置 ...
}

1.2 验证 HTTP/2 是否生效

使用以下命令检查：

curl -I -k --http2 https://your-domain.com

输出中应包含：

HTTP/2 200 
server: nginx
...

---

2. 必须的 SSL 优化配置

HTTP/2 强制要求 HTTPS，且性能与 SSL 配置强相关：

server {
    # ... 其他配置 ...

    # 启用 TLS 1.2/1.3（禁用不安全的旧版本）
    ssl_protocols TLSv1.2 TLSv1.3;

    # 优化加密套件（兼容性与性能平衡）
    ssl_ciphers 'ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384';
    ssl_prefer_server_ciphers on;

    # 会话复用（减少 TLS 握手开销）
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 24h;
    ssl_session_tickets off;  # 更安全，但可设为 on 以提升性能

    # OCSP 装订（加速证书验证）
    ssl_stapling on;
    ssl_stapling_verify on;
    resolver 8.8.8.8 1.1.1.1 valid=300s;
}

---

3. HTTP/2 专属优化

3.1 启用 Server Push（谨慎使用）

location / {
    http2_push /style.css;      # 推送关键 CSS
    http2_push /app.js;         # 推送关键 JS
    # ... 其他配置 ...
}

注意：过度推送会浪费带宽，需通过 Link 头动态控制更佳。

3.2 调整并发流限制

http {
    # 默认单个连接允许的最大并发流数（建议值）
    http2_max_concurrent_streams 128;

    # 流超时时间（毫秒）
    http2_streams_index_size 32;
    http2_recv_timeout 30s;
}

---

4. 与 WebSocket 的兼容配置

HTTP/2 与 WebSocket 可共存，但需明确协议升级：

location /wss {
    proxy_pass http://localhost:6001;
    proxy_http_version 1.1;      # 必须保留
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    # ... 其他 WebSocket 配置 ...
}

---

5. 性能压测与调优

5.1 使用 h2load 测试

h2load -n 100000 -c 100 -m 100 https://your-domain.com

• -n：总请求数
• -c：并发连接数
• -m：每个连接的并发流数

5.2 关键指标优化

参数	建议值	作用
keepalive_requests	10000	单个连接的最大请求数
keepalive_timeout	75s	保持连接的时间
sendfile	on	零拷贝文件传输
gzip	on	压缩响应（但避免压缩已压缩资源）

---

6. 常见问题解决

问题 1：浏览器不支持 HTTP/2

• 检查方法：
  Chrome 开发者工具 → Network → 协议列显示 h2
• 解决：确保客户端浏览器为现代版本（HTTP/2 支持自 Chrome 41+、Firefox 36+）

问题 2：Nginx 报错 invalid protocol

• 原因：未正确配置 SSL
• 解决：

  sudo nginx -t  # 测试配置
  sudo systemctl restart nginx
  

问题 3：HTTP/2 性能不如 HTTP/1.1

• 可能原因：
  • 未启用 SSL 会话复用
  • 服务器资源不足（HTTP/2 多路复用需要更高 CPU）
• 优化：调整 worker_processes 和 worker_connections

---

7. 完整配置示例

生产环境推荐配置：

http {
    # 全局 HTTP/2 参数
    http2_max_concurrent_streams 128;
    http2_streams_index_size 32;
    http2_recv_timeout 30s;

    server {
        listen 443 ssl http2;
        server_name your-domain.com;

        # SSL 配置
        ssl_certificate /etc/letsencrypt/live/your-domain.com/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/your-domain.com/privkey.pem;
        ssl_protocols TLSv1.2 TLSv1.3;
        ssl_ciphers 'ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256';
        ssl_prefer_server_ciphers on;
        ssl_session_cache shared:SSL:10m;
        ssl_session_timeout 24h;

        # 性能优化
        keepalive_timeout 75s;
        keepalive_requests 10000;
        sendfile on;
        tcp_nopush on;

        # 根路径配置
        location / {
            root /var/www/html;
            index index.html;
            http2_push /style.css;  # 示例推送
        }

        # WebSocket 兼容配置
        location /wss {
            proxy_pass http://localhost:6001;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
        }
    }
}

---

8. 高级技巧

8.1 动态资源优先级

通过 Link 头控制资源优先级：

location / {
    add_header Link "</style.css>; rel=preload; as=style";
    add_header Link "</app.js>; rel=preload; as=script";
}

8.2 灰度发布测试

对部分用户启用 HTTP/2：

map $cookie_user_type $http2_enabled {
    default "http2";
    "legacy" "";
}

server {
    listen 443 ssl $http2_enabled;
    # ... 其他配置 ...
}

---

通过以上配置，你的网站将获得：
✅ 更快的页面加载速度（多路复用、头部压缩）
✅ 更高的并发性能（单连接多请求）
✅ 更好的用户体验（减少延迟和阻塞）

验证工具推荐：

• HTTP/2 Test
• PageSpeed Insights
• Chrome DevTools 的 Network 面板