配置Nginx,开启HTTP/2

HTTP/2(超文本传输协议第2版,最初命名为 HTTP 2.0),是在 Google 之前提出的 SPDY 协议的基础上演变而来,相对 HTTP1.1 增加了连接复用、头部压缩、服务端 push 等特性。与 HTTP1.1 完全语义兼容,几乎可以无缝升级。目前主流浏览器都已经支持 HTTP/2 了(IE 自 IE 11 开始支持)。

开源版本的 Nginx 从 1.9.5 版开始支持 HTTP/2,其实配置也很简单,升级 Nginx 到最新版本,然后把之前 HTTPS 配置中的 spdy 改成 http2 就行了(listen 443 ssl http2 default_server),但改了之后发现并没有生效,直接退回到了 HTTP1.1。nginx -V 查看编译参数也带有 --with-http_v2_module,应该没什么问题才对。Google 了一把发现是 OpenSSL 版本的问题,我使用的是 ubuntu 14.04 下的 ppa:nginx/stable 源,这个源上的 Nginx 是在 OpenSSL 1.0.1f 上编译而成的,而 OpenSSL 的这个版本不支持 ALPN,所以无法开启 HTTP/2。

Note that accepting HTTP/2 connections over TLS requires the “Application-Layer Protocol Negotiation” (ALPN) TLS extension support, which is available only since OpenSSL version 1.0.2. Using the “Next Protocol Negotiation” (NPN) TLS extension for this purpose (available since OpenSSL version 1.0.1) is not guaranteed.

知道原因就好办了,先升级本地的 OpenSSL到最新版:

然后替换 Nginx 源为 ppa:ondrej/nginx 重新安装 Nginx:

现在再打开网站,发现 HTTP/2 已经开启成功了。

2016-05-21_233215

当然如果你是 ubuntu 16.04,就没有那么麻烦了,直接安装 Nginx 配置一下就行:https://www.digitalocean.com/community/tutorials/how-to-set-up-nginx-with-http-2-support-on-ubuntu-16-04

推荐阅读:

Dropbox 迁移到 HTTP/2 的经验,满满都是干货:https://blogs.dropbox.com/tech/2016/05/enabling-http2-for-dropbox-web-services-experiences-and-observations/

检查网站是否支持 SPDY 或者 HTTP/2 的 Chrome 扩展:HTTP/2 and SPDY indicator

参考资料:

https://www.nginx.com/blog/nginx-1-9-5/

http://serverfault.com/questions/732474/nginx-configured-with-http2-doesnt-deliver-http-2

http://nginx.org/en/docs/http/ngx_http_v2_module.html

为什么我们应该尽快支持 ALPN?https://imququ.com/post/enable-alpn-asap.html

Nginx HTTPS 配置实践

00 前言:

博客使用 HTTPS 已经有一段时间了,最近把当时的配置过程梳理、整理了一遍,希望能对有需要的同学有所帮助。

01 概念介绍:

最近 HTTPS 是越来越流行了,前一阵子的百度,最近的淘宝、知乎,都已经开启了全站 HTTPS 的时代。HTTPS 即 Hypertext Transfer Protocol Secure,简单理解就是在 HTTP 协议上做了一层加密。具体的握手过程和加密协议以后弄透彻了再写写。

无利不起早,那么 HTTPS 的好处是什么呢?我个人觉得有以下几点:

  1. 数据传输加密,防止信息被窃取。用户的密码、认证码、个人信息、表单数据等。对于移动 APP 甚至桌面端应用程序来说,由于 Web 化的趋势,目前 HTTP 协议应用很多,传输的信息加密越来越重要。
  2. 防欺诈。当你使用 EV 级别证书(http://www.wosign.com/EVSSL/index.htm)时,浏览器网址显示和一般 SSL 证书不一样。可以对比下:https://www.paypal.com/signin/ 和 https://www.baidu.com/。使用此类证书的网址,主流的浏览器都会在地址栏显示企业的名称(支持中文),增加了网站信任度,进一步防止用户被钓鱼网站欺骗,当然证书的价格也更贵一些。
  3. 防止劫持。这点可以说是国内各大公司下决心支持 HTTPS 的主要原因了。一旦被劫持,用户访问速度会变慢,看到的内容会被篡改,比如商家在百度投放的广告被替换成竞品的广告,淘宝的商品被带上小尾巴(返利链接),甚至直接跳转到 JD。这些不光是损害用户的利益,更是直接影响公司收入。
  4. 使用新的技术。比如 SPDY/HTTP 2 的基础都是 HTTPS,新协议对移动端 APP 性能提升帮助很大:《双11手淘前端技术: H5性能最佳实践》

当然 HTTPS 也不是完全的安全,不提高安全意识还是同样会被攻击:《使用 HTTPS 的网站也能被黑客监听到数据吗?》

02 证书申请:

证书申请的大概流程是,首先在自己的服务器使用 openssl 命令(尽量使用高版本的 OpenSSL,除了能规避漏洞,还能使用更高级的密钥加密/交换算法,提升安全性和性能)生成 csr 和 key 文件,命令如下:

如命令参数所示,RSA 的加密强度是 2048 位,使用了更安全的 sha256(SHA-2)哈希算法(SHA-1算法在2016年将不被证书厂商和现代浏览器支持)。

-subj 参数指定证书申请者的信息,如果不直接使用此参数,也会有交互式的命令提示填写这些参数。此部分具体参数释义:

Country Name (2 letter code) [GB]: 输入国家地区代码,如中国的 CN

State or Province Name (full name) [Berkshire]: 地区省份

Locality Name (eg, city) [Newbury]: 城市名称

Organization Name (eg, company) [My Company Ltd]: 公司名称

Organizational Unit Name (eg, section) []: 部门名称

Common Name (eg, your name or your server’s hostname) []: 申请证书域名,如果是泛域名证书,则应该填写 *.example.com

Email Address []: 电子邮箱

生成的 csr 文件包含了主要的证书信息,key 文件主要包含了密钥交换和加密等信息(私钥,注意保存)。然后把 csr 文件提交给 CA 厂商,中间还有一些信息验证过程,一般几天后(根据证书类型不同,所需时间不一样)就会发一份邮件给你,邮件附件带有签好的证书文件 example_com.crt(注意后缀,内容也变了),同时会给你CA的证书链,CA.crt(通常是 3 个文件,包括 2 个中间证书和 1 个根证书,按照证书信任链由下到上,把文件合并cat COMODOECCDomainValidationSecureServerCA.crt COMODOECCAddTrustCA.crt AddTrustExternalCARoot.crt > CA.crt,统称CA.crt)。

03 配置详解:

后面的步骤各个 HTTP Server 就有点不一样了: Continue Reading…

巧用七牛CDN的镜像功能使百度分享支持HTTPS

唉,好懒呀,好久没更新博客了。

最近搞了个 HTTPS 证书,像以前一样给博客添加了个百度分享(http://share.baidu.com/)的组件,但发现百度分享不支持 HTTPS(百度分享图标出不来,console 会提示页面有不安全的脚本元素)。看了其它几家也都不支持,搜索了下发现有人建议把百度分享所需的 js 都保存到自己本地就行了。这也是个办法,分享功能大多是抓取这个页面的 title、摘要、图片等然后起调一个页面完成分享,这些都是本地 js 文件能完成的。

看了下从百度分享获取的代码,里面主要加载了这个:http://bdimg.share.baidu.com/static/api/js/share.js,访问了一下果然还是不支持 HTTPS。然后我就天真的把 share.js 上传到了七牛 CDN(七牛是支持 HTTPS的,在空间设置-域名配置里面设置下就行),然而百度分享的图标还是没出来。看了下控制台,卧槽,又加载了一堆 js,作为一个全栈工程师,我非常灵性的瞅了眼代码里面有一段:domain:{staticUrl:”http://bdimg.share.baidu.com/”},原来是模块化加载,把链接替换成七牛 CDN  的链接后有些请求 404 了,我又天真的以为把这几个 js 文件补全就行,但是补完几个,又有几个文件 404 了,我可没耐心一个个文件补齐呀。

作为一个灵性码农,我马上想到七牛不是有个镜像存储功能嘛,设置一发:

20150817003746

故事就这么结束了吗?怎么可能。百度“幺蛾子”还是比较多。百度分享不光是分享功能,还有分享的数据分析。数据哪里来呢?前端埋点统计的呀,原理简单说就是监控分享时的点击事件,发送数据到后台。这其中的核心就是 http://nsclick.baidu.com/v.gif,需要统计的参数和值都以 GET 参数的形式附在链接后面。然后后端再清洗请求日志或者获取请求的时候就直接把数据入库了。但这个统计小图片也不支持 HTTPS。没办法,只能去掉了,方法也很简单,static/api/js/trans/logger.js 文件为空就行(上传个空文件、占个位)。到此才算大功告成。

上面是授之以渔,不想自己弄的,可以直接抓鱼,当然希望你也能明白其中的风险,文件是我这边的(可能有后门,当然我没有),而且哪天我流量没了可能会把文件删了。

update:2016-05-24,七牛账单已经超支,上面的代码地址已经失效,还请见谅。其实了解原理之后自己设置一个即可,或者自己 Nginx 反代一下。

一点后话:一直感觉百度分享没人维护了,在群里打听了下。应该是有人(部门)维护着(至于不支持 HTTPS 那是百度 CDN 的锅),但是现在不流行打社交牌了,公司也不重视这块了,还是 200 亿糯米 O2O 更实在,而且百度首页貌似也不显示搜索结果页面的分享次数了。