别再用HTTP/1这个老古董了,两招帮你升级HTTP/2

头两天分析 SSE 技术的时候简单提过HTTP/2的事儿,毕竟HTTP/1.x协议早已经算是"老古董"级别的了。

升级理由

从HTTP/1.x升级到HTTP/2可以带来多方面的性能提升和优化:

多路复用(Multiplexing)

  • 在HTTP/1.x中,每个TCP连接只能处理一个请求或响应,这导致了所谓的"队头阻塞"问题。而在HTTP/2中,多路复用允许在同一个TCP连接上同时发送多个请求和响应,极大地提高了资源的利用效率,并减少了页面加载时间。

头部压缩(Header Compression)

  • HTTP/2引入了HPACK算法来压缩HTTP头部信息,减少了每次请求和响应所需的传输数据量。这对于移动网络环境尤其有利,因为它能减少延迟时间和带宽使用。

提高安全性

  • 虽然HTTP/2可以在理论上支持明文传输,但所有主流浏览器仅支持通过TLS(通常是HTTPS)实现的HTTP/2。这意味着采用HTTP/2通常也意味着增强了网站的安全性。

升级到HTTP/2能够显著提升网站的加载速度和用户体验,尤其是在高延迟或者低带宽环境下。

总之就是:

升级方法

申请证书

当前大多数现代浏览器只在使用TLS(即HTTPS)时才支持HTTP/2,因此需要网站配置SSL/TLS证书(最好启动强制HTTPS)。

如果没有SSL证书,可以考虑使用Let's Encrypt免费获取一个。(国内几个云产品平台好像也可以)

升级Web服务器

高版本的Web服务器才支持 HTTP/2:

  • Apache:从2.4.17版本开始支持HTTP/2。
  • Nginx:从1.9.5版本开始支持HTTP/2。
  • IIS:Windows Server 2016和Windows 10起支持HTTP/2。

Apache

确保mod_http2模块已经安装并启用。

bash 复制代码
<VirtualHost *:443>
    ...
    
    # 确保启用了SSL
    SSLEngine on
    SSLCertificateFile /path/to/your_domain_name.crt
    SSLCertificateKeyFile /path/to/your_private.key
    SSLCertificateChainFile /path/to/DigiCertCA.crt

    # 启用HTTP/2
    Protocols h2 http/1.1
    
    ...
</VirtualHost>

// 同时支持HTTP/2和HTTP/2的明文版本(h2c)
Protocols h2 h2c http/1.1

注意!大多数浏览器不支持非加密的HTTP/2连接(h2c)。

修改完成以后记得重启!!!

Nginx

先确保Nginx编译时包含了HTTP/2模块。你可以通过运行nginx -V命令检查是否存在--with-http_v2_module。

perl 复制代码
server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;

    # 将所有HTTP请求重定向到HTTPS
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;  # 注意这里的http2参数
    
    ...
}

IIS

如果使用的是Windows Server 2016或Windows 10及更新版本,IIS默认支持HTTP/2。

只需确保你的网站启用了HTTPS,IIS将自动启用HTTP/2支持,无需额外配置。

验证

想要查看自己的网站是否成功开启了HTTP/2的话,打开Chrome控制台,选择NetWork,选择任意接口点击右键。

选择 Header Options,勾选 Protocol,刷新页面。

可以看到 NetWork 中多处一列 Protocol,这里如果显示 h2 则表明开启HTTP/2成功。

相关推荐
程序员爱钓鱼9 小时前
Go语言实战案例 — 项目实战篇:简易博客系统(支持评论)
前端·后端·go
excel16 小时前
ES6 中函数的双重调用方式:fn() 与 fn\...``
前端
可乐爱宅着17 小时前
全栈框架next.js入手指南
前端·next.js
Lei活在当下17 小时前
【业务场景架构实战】4. 支付状态分层流转的设计和实现
架构·android jetpack·响应式设计
你的人类朋友18 小时前
什么是API签名?
前端·后端·安全
会豪20 小时前
Electron-Vite (一)快速构建桌面应用
前端
中微子20 小时前
React 执行阶段与渲染机制详解(基于 React 18+ 官方文档)
前端
唐某人丶20 小时前
教你如何用 JS 实现 Agent 系统(2)—— 开发 ReAct 版本的“深度搜索”
前端·人工智能·aigc
中微子20 小时前
深入剖析 useState产生的 setState的完整执行流程
前端
架构师沉默20 小时前
设计多租户 SaaS 系统,如何做到数据隔离 & 资源配额?
java·后端·架构