https 请求白屏_记一次HTTPS性能优化

为了解决部分 ios 打开 h5 网页很慢的情况（参考地址：https://developers.weixin.qq.com/community/develop/doc/000a6671efc968a3ce2acb27d59400）

场景描述

微信版本 7.0.15，IOS 版本 13.5.1，网站 ssl 证书颁发者 Let's Encrypt 免费证书

症状：微信扫码或直接打开请求地址后，页面白屏顶部进度条加载非常慢，大概要4-5秒

同事的某些手机（Phone6s 和 iPhone11）用户前几次打开页面请求接口的时候会出现，之后再打开会快一些。同样网络环境下，安卓手机打开很快，iPhone6SPlus 的打开也很快

前提，已经开启HTTPS服务，比如有下列配置，有 crt, key 格式的证书文件

    listen                     80;
    listen                     443 ssl http2;
    server_name                xxx.xxx.com;# 域名
    ssl_certificate            /data/proxy/sites/webset/ssl/site.crt;
    ssl_certificate_key        /data/proxy/sites/webset/ssl/site.key;
    ssl_prefer_server_ciphers  on;
    ssl_ciphers                ECDHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA256:ECDHE-RSA-AES256-SHA:ECDHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES128-SHA256:DHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES256-GCM-SHA384:AES128-GCM-SHA256:AES256-SHA256:AES128-SHA256:AES256-SHA:AES128-SHA:DES-CBC3-SHA:HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4;
    ssl_protocols              TLSv1 TLSv1.1 TLSv1.2;
    ssl_session_cache          shared:SSL:5m;
    ssl_session_timeout        5m;

    keepalive_timeout          75s;
    keepalive_requests         100;
    access_log                 /data/proxy/sites/webset/log/nginx/access.log;
    error_log                  /data/proxy/sites/webset/log/nginx/error.log;
    set_real_ip_from           127.0.0.1;
    real_ip_header             X-Forwarded-For;
    real_ip_recursive          on;
    gzip                       on;
    gzip_comp_level            6;
    gzip_min_length            1k;
    gzip_types                 text/plain text/css text/xml text/javascript text/x-component application/json application/javascript application/x-javascript application/xml application/xhtml+xml application/rss+xml application/atom+xml application/x-font-ttf application/vnd.ms-fontobject image/svg+xml image/x-icon font/opentype;

将 .crt 的 ssl 证书文件转换成 .pem 格式

参考：证书之间的转换（crt pem key）

使用下面的 openssl 命令：

openssl x509 -in www.x.com.crt -out www.x.com.pem

优化方案

开启 OCSP Stapling

参考地址：Nginx之OCSP stapling配置

参考地址：Nginx 启用 OCSP Stapling的配置

参考地址：从无法开启 OCSP Stapling 说起，OCSP是什么

在上面的 nginx 配置中增加如下内容

    ssl_stapling               on;
    ssl_stapling_verify        on; # 启用OCSP响应验证，OCSP信息响应适用的证书
    ssl_trusted_certificate    /data/proxy/sites/xxx.xxx.com/ssl/site.pem; #若 ssl_certificate 指令指定了完整的证书链，则 ssl_trusted_certificate 可省略。
    resolver                   8.8.8.8 8.8.4.4 114.114.114.114 216.146.35.35 216.146.36.36 208.67.220.220 208.67.220.220 valid=300s; #添加resolver解析OSCP响应服务器的主机名，valid表示缓存。
    resolver_timeout           5s; #resolver_timeout表示网络超时时间

修改后的配置为：

 listen                     80;
    listen                     443 ssl http2;
    server_name                xxx.xxx.com;# 域名
    ssl_certificate            /data/proxy/sites/xxx.xxx.com/ssl/site.crt;
    ssl_certificate_key        /data/proxy/sites/xxx.xxx.com/ssl/site.key;
    ssl_prefer_server_ciphers  on;
    ssl_ciphers                ECDHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA256:ECDHE-RSA-AES256-SHA:ECDHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES128-SHA256:DHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES256-GCM-SHA384:AES128-GCM-SHA256:AES256-SHA256:AES128-SHA256:AES256-SHA:AES128-SHA:DES-CBC3-SHA:HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4;
    ssl_protocols              TLSv1 TLSv1.1 TLSv1.2;
    ssl_session_cache          shared:SSL:5m;
    ssl_session_timeout        5m;

    ssl_stapling               on;
    ssl_stapling_verify        on; # 启用OCSP响应验证，OCSP信息响应适用的证书
    ssl_trusted_certificate    /data/proxy/sites/xxx.xxx.com/ssl/site.pem; #若 ssl_certificate 指令指定了完整的证书链，则 ssl_trusted_certificate 可省略。
    resolver                  8.8.8.8 8.8.4.4 114.114.114.114 216.146.35.35 216.146.36.36 208.67.220.220 208.67.220.220 valid=300s; #添加resolver解析OSCP响应服务器的主机名，valid表示缓存。
    resolver_timeout           5s; #resolver_timeout表示网络超时时间

    keepalive_timeout          75s;
    keepalive_requests         100;
    access_log                 /data/proxy/sites/xxx.xxx.com/log/nginx/access.log;
    error_log                  /data/proxy/sites/xxx.xxx.com/log/nginx/error.log;
    set_real_ip_from           127.0.0.1;
    real_ip_header             X-Forwarded-For;
    real_ip_recursive          on;
    gzip                       on;
    gzip_comp_level            6;
    gzip_min_length            1k;
    gzip_types                 text/plain text/css text/xml text/javascript text/x-component application/json application/javascript application/x-javascript application/xml application/xhtml+xml application/rss+xml application/atom+xml application/x-font-ttf application/vnd.ms-fontobject image/svg+xml image/x-icon font/opentype;

检测命令（设置完成后，重启 nginx，然后可能需要稍等几分钟检测才会是开启成功）

openssl s_client -connect 域名:443 -status -tlsextdebug < /dev/null 2>&1 | grep -i "OCSP response"

如果你的服务器上部署了多个 HTTPS 站点，可能还需要加上 -servername 参数启用 SNI：

openssl s_client -connect 域名:443 -servername 域名或服务名  -status -tlsextdebug < /dev/null 2>&1 | grep -i "OCSP response"

如果结果是下面这样，说明 OCSP Stapling 已开启：

OCSP response:
OCSP Response Data:
    OCSP Response Status: successful (0x0)
    Response Type: Basic OCSP Response

而这样显然是未开启：

OCSP response: no response sent

开启 OCSP Stapling 后，同事的设备首次打开网站或请求接口速度从 4000ms 提升到了 500ms，速度提升了 8 倍。