{"id":8489,"date":"2016-08-12T00:00:37","date_gmt":"2016-08-11T16:00:37","guid":{"rendered":"https:\/\/ihower.tw\/blog\/?p=8489"},"modified":"2017-07-19T14:33:57","modified_gmt":"2017-07-19T06:33:57","slug":"%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2","status":"publish","type":"post","link":"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2","title":{"rendered":"\u66f4\u5feb\u66f4\u5b89\u5168: \u6bcf\u500b\u7db2\u7ad9\u90fd\u61c9\u8a72\u5347\u7d1a\u5230 HTTP\/2"},"content":{"rendered":"<p>(\u672c\u6587 crossposting \u65bc <a href=\"https:\/\/blog.alphacamp.co\/2016\/07\/12\/http2\/\">ALPHACamp Blog<\/a>)<\/p>\n<p>\u5982\u679c\u8aaa\u6709\u4e00\u9805\u6280\u8853\u53ef\u4ee5\u8b93\u4f60\u7684\u7db2\u7ad9\u700f\u89bd\u8d77\u4f86\u66f4\u5feb\u3001\u66f4\u5b89\u5168\u3001SEO \u52a0\u5206\uff0c\u800c\u4e14\u7db2\u7ad9\u5de5\u7a0b\u5e2b\u4e0d\u9700\u8981\u6539 code \u5c31\u53ef\u4ee5\u5168\u7ad9\u4f7f\u7528\u3002\u66f4\u91cd\u8981\u7684\u662f\uff0c\u9084\u4e0d\u7528\u984d\u5916\u82b1\u9322\uff0c\u5929\u5e95\u4e0b\u6709\u9019\u9ebc\u597d\u7684\u4e8b\u60c5\u55ce\uff1f<\/p>\n<p>\u8a71\u8aaa HTTP \u901a\u8a0a\u5354\u5b9a\u662f\u5168\u7403\u8cc7\u8a0a\u7db2(WWW)\u7684\u57fa\u790e\uff0c\u662f\u700f\u89bd\u5668\u548c\u7db2\u7ad9\u4f3a\u670d\u5668\u4e4b\u9593\u7684\u901a\u8a0a\u5354\u5b9a\u3002\u800c <a href=\"https:\/\/http2.github.io\">HTTP\/2<\/a> \u662f HTTP\/1.1 \u5f9e 1999 \u5e74\u767c\u5e03\u4ee5\u4f86\uff0c\u5341\u516d\u5e74\u4f86\u7684\u6700\u91cd\u8981\u7684\u4e00\u6b21\u5347\u7d1a\uff0c\u9019\u6b21\u5347\u7d1a\u7684\u4e3b\u8981\u76ee\u7684\uff0c\u5c31\u662f\u70ba\u4e86\u6539\u5584\u700f\u89bd\u5668\u7684\u7db2\u9801\u4e0b\u8f09\u901f\u5ea6(Page Load Time)\u3002<\/p>\n<p>\u773c\u898b\u70ba\u6191\uff0c\u4ee5\u4e0b\u662f\u4e00\u4e9b\u6e2c\u8a66\u7db2\u7ad9\uff0c\u6bd4\u8f03 HTTP\/1.1 \u548c HTTP\/2 \u7684\u901f\u5ea6\u5dee\u7570\uff0c\u9019\u5728\u5716\u591a\u7684\u60c5\u6cc1\u6700\u70ba\u660e\u986f\uff1a<\/p>\n<ul>\n<li><a href=\"https:\/\/http2.akamai.com\/demo\">Akamai: HTTP\/2 is the future of the Web, and it is here!<\/a><\/li>\n<li><a href=\"http:\/\/www.http2demo.io\/\">HTTP\/2 TECHNOLOGY DEMO<\/a><\/li>\n<li><a href=\"https:\/\/www.httpvshttps.com\/\">HTTP vs HTTPS Test<\/a><\/li>\n<\/ul>\n<p><!--more--><\/p>\n<p>\u8b1b\u8d77 HTTP\/2 \u7684\u6b77\u53f2\uff0c\u7b46\u8005\u5728\u5169\u5e74\u524d\u66fe\u7d93\u5728 WebConf \u5927\u6703\u4e0a<a href=\"https:\/\/www.youtube.com\/watch?v=r74RAcrc1ZA\">\u4ecb\u7d39 SPDY<\/a> \u9019\u500b\u901a\u8a0a\u5354\u5b9a\u3002SPDY \u662f Google \u72f9\u8457 Chrome \u700f\u89bd\u5668\u9f90\u5927\u5e02\u4f54\u7387\uff0c\u5728 2009-2016 \u5e74\u6240\u9032\u884c\u7684\u5927\u898f\u6a21\u7db2\u8def\u5be6\u9a57\uff0c\u5728\u7372\u5f97\u4e86\u986f\u8457\u7684\u6210\u529f\u4e4b\u5f8c\uff0c\u9032\u4e00\u6b65\u5c07 SPDY \u63a8\u5411\u7db2\u8def\u6a19\u6e96\uff0c\u7d42\u65bc\u5728 2015\/5 \u6b63\u5f0f\u767c\u5e03\u4e86\u3002\u76ee\u524d\u5305\u62ec Chrome\u3001Safari\u3001Firefox\u3001IE\/Edge \u700f\u89bd\u5668\u90fd\u5df2\u7d93\u652f\u63f4(\u8a73\u898b <a href=\"http:\/\/caniuse.com\/#feat=http2\">Can I Use?<\/a>)\uff0c\u800c\u4f60\u5e73\u5e38\u700f\u89bd\u7684 Yahoo\u3001Facebook\u3001Google\u3001ALPHA Camp Blog \u7b49\u7b49\u4e00\u7dda\u5927\u5ee0\u7db2\u7ad9\uff0c\u4e5f\u90fd\u5df2\u7d93\u652f\u63f4\u4e0a HTTP\/2\u3002\u5728\u4e0d\u77e5\u4e0d\u89ba\u4e2d\uff0cHTTP\/2 \u5df2\u7d93\u9032\u5165\u4f7f\u7528\u8005\u7684\u751f\u6d3b\u3002<\/p>\n<p>\u56e0\u6b64\uff0c\u73fe\u5728\u4e5f\u662f\u6642\u5019\u5168\u9762\u666e\u53ca\uff0c\u8eab\u70ba\u7db2\u7ad9\u4e3b\u4f60\u4e0d\u53ef\u4e0d\u77e5\u9053 HTTP\/2\u3002<\/p>\n<h2 id=\"toc_1\">HTTP\/2 \u6539\u4e86\u4ec0\u9ebc?<\/h2>\n<p>HTTP\/2 \u5728\u8a9e\u610f\u4e0a\u5b8c\u5168\u5411\u4e0b\u76f8\u5bb9\uff0c\u5b83\u6539\u9032\u7684\u662f\u5e95\u5c64\u901a\u8a0a\u5c01\u5305\u7684\u5be6\u4f5c\u3002Web \u958b\u767c\u8005\u719f\u6089\u7684 HTTP \u64cd\u4f5c\u5982 GET\/POST \u64cd\u4f5c\u3001HTTP Status Code \u548c\u5404\u7a2e HTTP Headers \u90fd\u6c92\u6709\u6539\u8b8a\uff0c\u5b8c\u5168\u8207 HTTP 1.1 \u517c\u5bb9\u3002\u56e0\u6b64\u4f3a\u670d\u5668\u7aef\u8981\u4f7f\u7528 HTTP\/2\uff0c\u5b8c\u5168\u4e0d\u9700\u8981\u4fee\u6539 HTML\/CSS\/JavaScript \u7db2\u9801\u548c\u4f60\u7684\u5f8c\u7aef\u7a0b\u5f0f\uff0c\u53ea\u8981\u5347\u7d1a\u548c\u8a2d\u5b9a Web \u4f3a\u670d\u5668\u8edf\u9ad4\uff0c\u52a0\u4e0a\u652f\u63f4 HTTP\/2 \u7684\u700f\u89bd\u5668\uff0c\u5c31\u53ef\u4ee5\u4f7f\u7528\u9019\u500b\u8d85\u5feb\u7684\u901a\u8a0a\u5354\u5b9a\u3002<\/p>\n<p><a href=\"http:\/\/www.oreilly.com\/webops-perf\/free\/HTTP2-high-perf-browser-networking.csp\"><br \/>\n<img loading=\"lazy\" decoding=\"async\" data-attachment-id=\"8769\" data-permalink=\"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2\/http2-layer\" data-orig-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer.png\" data-orig-size=\"561,349\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"http2-layer\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer-300x187.png\" data-large-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer.png\" src=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer.png\" alt=\"\" width=\"561\" height=\"349\" class=\"alignnone size-full wp-image-8769\" srcset=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer.png 561w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/http2-layer-300x187.png 300w\" sizes=\"auto, (max-width: 561px) 100vw, 561px\" \/><\/a><\/p>\n<p>\u8981\u4e86\u89e3 HTTP\/2 \u65bd\u5c55\u4e86\u4ec0\u9ebc\u9b54\u6cd5\uff0c\u6211\u5011\u5148\u4f86\u56de\u9867\u4e00\u4e0b\u73fe\u4eca\u7db2\u9801\u8f09\u5165\u901f\u5ea6\u7684\u6311\u6230\u662f\u4ec0\u9ebc\u3002<\/p>\n<p>\u96a8\u8457\u7db2\u9801\u5167\u5bb9\u8d8a\u4f86\u8d8a\u8907\u96dc\uff0c\u9020\u6210\u4e86\u8981\u5b8c\u6210\u4e00\u500b\u7db2\u9801\u8f09\u5165(Page Load)\u7684\u52d5\u4f5c\uff0c\u9664\u4e86\u8981\u4e0b\u8f09 HTML \u4e4b\u5916\uff0c\u9084\u9700\u8981\u4e0b\u8f09 CSS \u6a94\u6848\u3001JavaScript \u6a94\u6848\u3001\u5404\u7a2e\u5716\u7247\u6a94\u6848\uff0c\u96f6\u96f6\u7e3d\u7e3d\u52a0\u8d77\u4f86\u9700\u8981\u5df2\u7d93\u591a\u9054\u4e0a\u767e\u500b\u5c0d\u4f3a\u670d\u5668\u7684 Request \u8acb\u6c42\u8cc7\u6e90\uff0c\u5927\u5927\u5f71\u97ff\u4e86\u7db2\u9801\u8f09\u5165\u7684\u901f\u5ea6\u3002\u5728\u9019\u4e00\u79d2\u9418\u5e7e\u5341\u842c\u4e0a\u4e0b\u7684\u6642\u4ee3\uff0cAmazon \u7684\u7db2\u9801\u8f09\u5165\u6642\u9593\u6bcf\u591a\u4e00\u79d2\uff0c\u8a72\u516c\u53f8\u7684\u5e74\u5ea6\u71df\u6536\u5c31\u6e1b\u5c11 16 \u5104\u7f8e\u5143\u3001Google \u7684\u641c\u5c0b\u6642\u9593\u6bcf\u591a 0.4 \u79d2\uff0c\u6bcf\u5929\u7684\u641c\u5c0b\u6b21\u6578\u5c31\u6703\u6e1b\u5c11 8 \u767e\u842c\u7db2\u9801\u3001KISSmetric \u5206\u6790\u5831\u544a\u6307\u51fa\u8d85\u904e 4 \u79d2 Bounce Rate \u589e\u52a0 25%\u3002\u4eba\u7684\u601d\u7dd2\u5728\u7b49 1 \u79d2\u5f8c\u5c31\u958b\u59cb\u98c4\u79fb\uff0c\u5982\u679c\u9700\u8981\u7b49 10 \u79d2\uff0c\u5c31\u6703\u611f\u89ba\u9019\u6771\u897f\u662f\u4e0d\u662f\u58de\u4e86\u3002<\/p>\n<p>\u9019\u500b\u554f\u984c\u7684\u6700\u5927\u539f\u56e0\uff0c\u5728\u65bc HTTP\/1.1 \u6709\u4e00\u500b\u975e\u5e38\u5927\u7684\u7f3a\u9677\u662f\u6bcf\u500b\u5c0d\u4f3a\u670d\u5668\u7684 Request \u8cc7\u6e90\u8acb\u6c42\uff0c\u90fd\u5fc5\u9808\u4f54\u7528\u4e00\u500b\u7db2\u8def\u9023\u7dda(TCP connection)\uff0c\u50b3\u5b8c\u4e00\u500b\u6a94\u6848\u624d\u80fd\u518d\u50b3\u4e0b\u4e00\u500b\uff0c\u700f\u89bd\u5668\u7121\u6cd5\u540c\u6642\u4e0b\u8f09\u3002\u56e0\u6b64\u5728 HTTP\/1.1 \u6642\u4ee3\uff0c\u700f\u89bd\u5668\u70ba\u4e86\u52a0\u901f\u4e0b\u8f09\u7684\u6642\u9593\uff0c\u53ea\u597d\u540c\u6642\u5141\u8a31\u516d\u500b\u7db2\u8def\u9023\u7dda(TCP connection)\u4f75\u767c\u53bb\u9023\u63a5\u4f3a\u670d\u5668\uff0c\u597d\u53ef\u4ee5\u9054\u6210\u540c\u6642\u4e0b\u8f09\u516d\u500b\u8cc7\u6e90\u3002\u4f46\u662f\u6975\u9650\u4e5f\u662f\u5982\u6b64\u4e86\uff0c\u4e26\u4e0d\u662f\u8aaa\u7121\u9650\u5236\u589e\u52a0\u7db2\u8def\u9023\u7dda\u5c31\u53ef\u4ee5\u89e3\u6c7a\u9019\u500b\u74f6\u9838\uff0c\u56e0\u70ba\u6bcf\u4e00\u6b21\u7684\u7db2\u8def\u9023\u7dda\uff0c\u90fd\u5fc5\u9808\u7d93\u904e<a href=\"https:\/\/en.wikipedia.org\/wiki\/Handshaking\">\u4e09\u6b21\u63e1\u624b<\/a>\u7684\u521d\u59cb\u7db2\u8def\u9023\u7dda\u7a0b\u5e8f\uff0c\u800c\u4e14\u6bcf\u6b21\u521d\u59cb\u9023\u7dda\u56e0\u70ba<a href=\"https:\/\/en.wikipedia.org\/wiki\/Flow_control_(data)\">\u6d41\u91cf\u63a7\u5236<\/a>\u7684\u95dc\u4fc2\uff0c\u4e00\u958b\u59cb\u7684\u7db2\u8def\u5c01\u5305\u6703\u50b3\u8f38\u6bd4\u8f03\u6162\uff0c\u5f8c\u4f86\u624d\u9010\u6f38\u52a0\u5feb\u3002<\/p>\n<p>\u4e5f\u56e0\u70ba HTTP\/1.1 \u7684\u9019\u500b\u9650\u5236\uff0c\u7576\u4eca Web \u958b\u767c\u8005\u91dd\u5c0d\u7db2\u7ad9\u6548\u80fd\u512a\u5316\u6642\uff0c\u767c\u5c55\u51fa\u4e86\u5404\u7a2e\u5947\u6280\u6deb\u5de7\u4f86\u52a0\u5feb\u7db2\u9801\u4e0b\u8f09\u901f\u5ea6\uff0c\u7a0d\u5019\u6211\u5011\u6703\u63d0\u5230\u9019\u4e9b\u5728\u65b0\u7684 HTTP\/2 \u6280\u8853\u4e0b\uff0c\u5b8c\u5168\u662f\u591a\u9918\u7684\u3002<\/p>\n<p>\u90a3\u9ebc\uff0cHTTP\/2 \u662f\u5982\u4f55\u6539\u826f\u7684\u5462\uff1f\u5b83\u63a1\u7528\u7684\u89e3\u6cd5\u5305\u62ec\uff1a <\/p>\n<ul>\n<li>\u53ea\u9700\u8981\u55ae\u4e00\u7db2\u8def\u9023\u7dda(Single TCP connection)\uff0c\u5c31\u53ef\u4ee5\u9023\u63a5\u7db2\u7ad9\u4f3a\u670d\u5668\uff0c\u4e0b\u8f09\u6240\u6709\u9700\u8981\u7684\u8cc7\u6e90\u3002\u5927\u5927\u7bc0\u7701 HTTP\/1.1 \u9700\u8981\u4e00\u76f4\u5efa\u7acb\u591a\u500b\u7db2\u8def\u9023\u7dda\u6642\u7684\u555f\u52d5\u6642\u9593\u6d6a\u8cbb\u3002<\/li>\n<li>\u9023\u7dda\u591a\u5de5(Multiplexing)\uff0c\u5728\u55ae\u4e00\u7db2\u8def\u9023\u7dda\u4e0a\uff0c\u5c31\u53ef\u4ee5\u540c\u6642\u50b3\u8f38\u591a\u500b HTTP Request \u548c Response\uff0c\u4f75\u767c\u8acb\u6c42 CSS\/JS\/Images \u7b49\u7b49\u8cc7\u6e90\u3002\u5b83\u7684\u539f\u7406\u662f\u5c07  Requests\/Responses \u90fd\u62c6\u788e\u6210\u5c0f frames \u9032\u884c\u50b3\u8f38\uff0c\u800c\u9019\u4e9b frames \u662f\u53ef\u4ee5\u4ea4\u932f\u7684\uff0c\u56e0\u6b64\u6a94\u6848\u518d\u591a\u4e5f\u4e0d\u6015\uff0c\u4e0d\u6703\u767c\u751f\u4f54\u7528\u7db2\u8def\u9023\u7dda(TCP connection)\u7684\u60c5\u6cc1\u3002\u9019\u5c31\u662f\u70ba\u4ec0\u9ebc\u5728\u5716\u6a94\u591a\u7684\u60c5\u6cc1\u4e0b\uff0cHTTP\/2 \u7279\u5225\u6709\u512a\u52e2\u3002<\/li>\n<li>\u512a\u5148\u6b0a\u8a2d\u8a08(<a href=\"https:\/\/nghttp2.org\/blog\/2014\/04\/27\/how-dependency-based-prioritization-works\/\">Prioritization<\/a>)\uff0c\u4f3a\u670d\u5668\u53ef\u4ee5\u6c7a\u5b9a\u4f8b\u5982 CSS \u6216 JavaScript \u6a94\u6848\uff0c\u54ea\u4e9b\u8981\u512a\u5148\u50b3\u9001\u3002<\/li>\n<li>Header \u58d3\u7e2e\uff0c\u5728 HTTP\/1.1 \u7684 Headers \u5176\u5be6\u662f\u6c92\u6709\u58d3\u7e2e\u7684\uff0c\u5927\u5c0f\u4f54\u4e86\u7d04 200 bytes \u5230 2KB \u4e0d\u7b49\uff0c\u800c\u4e14\u540c\u4e00\u700f\u89bd\u5668\u7684\u6bcf\u500b Requests \u5176\u5be6\u7d55\u5927\u90e8\u4efd\u7684 Headers \u90fd\u662f\u91cd\u8907\u7684\u3002HTTP\/2 \u7528\u4e86 <a href=\"https:\/\/http2.github.io\/http2-spec\/compression.html\">HPACK<\/a> \u58d3\u7e2e\u6280\u8853\uff0c\u5927\u5927\u6e1b\u5c11\u6bcf\u6b21\u90fd\u8981\u91cd\u8907\u50b3\u8f38\u4e00\u6a23\u7684 Headers\u3002<\/li>\n<li>Binary \u4e8c\u9032\u4f4d\u7684\u5c01\u5305\u7d50\u69cb\u8a2d\u8a08\uff0c\u5c0d\u4f3a\u670d\u5668\u548c\u700f\u89bd\u5668\u4f86\u8aaa\uff0c\u53ef\u4ee5\u66f4\u5feb\u7684\u89e3\u6790\u9019\u4e9b\u8cc7\u6599\u3002\u51b7\u77e5\u8b58\uff1a\u5728 HTTP\/1.1 \u5b9a\u7fa9\u4e86<a href=\"https:\/\/www.w3.org\/Protocols\/rfc2616\/rfc2616-sec4.html#sec4.4\">\u56db\u7a2e\u89e3\u6790\u8a0a\u606f\u7684\u65b9\u5f0f<\/a>\uff0c\u5728 HTTP\/2 \u53ea\u9700\u8981\u4e00\u7a2e\u3002<\/li>\n<li>\u4f3a\u670d\u5668\u4e3b\u52d5\u63a8\u9001\u8cc7\u6e90(Server Push)\uff0c\u5141\u8a31\u4f3a\u670d\u5668\u9664\u4e86 HTML \u4e4b\u5916\uff0c\u9023\u540c\u9700\u8981\u7684 CSS\/JavaScript\/Images \u6a94\u6848\uff0c\u4e3b\u52d5\u63a8\u5230\u700f\u89bd\u5668\u7684\u5feb\u53d6\u4e4b\u4e2d\u3002\u4e0d\u904e\uff0c\u9019\u500b\u529f\u80fd\u6bd4\u8f03\u6709\u722d\u8b70\uff0c\u4e00\u4f86\u4ed6\u9700\u8981 Web \u958b\u767c\u8005\u984d\u5916\u63cf\u8ff0\u6709\u54ea\u4e9b\u6a94\u6848\u9700\u8981\u96a8\u8457 HTML \u4e00\u8d77\u63a8\u9001\u7d66\u700f\u89bd\u5668\uff0c\u4e0d\u662f Web \u4f3a\u670d\u5668\u5347\u7d1a HTTP\/2 \u5c31\u81ea\u52d5\u6703\u6709\u3002\u4e8c\u4f86\u5b83\u4e0d\u7ba1\u700f\u89bd\u5668\u662f\u4e0d\u662f\u5df2\u7d93\u6709\u5feb\u53d6\u9019\u500b\u8cc7\u6e90\uff0c\u90fd\u6703\u63a8\u9001\u800c\u9020\u6210\u983b\u5bec\u6d6a\u8cbb\u3002\u56e0\u6b64\u5be6\u52d9\u4e0a\u7b46\u8005\u8a8d\u70ba\u53ef\u4ee5\u6539\u7528\u700f\u89bd\u5668\u7684 <a href=\"https:\/\/css-tricks.com\/prefetching-preloading-prebrowsing\/\">Prefetch<\/a> \u529f\u80fd\uff0c\u8b93\u5ba2\u6236\u7aef\u7684\u700f\u89bd\u5668\u81ea\u5df1\u8655\u7406\u5373\u53ef\u3002<\/li>\n<\/ul>\n<p>\u900f\u904e\u9019\u4e9b\u6280\u8853\uff0c\u8b93\u700f\u89bd\u5668\u7684\u7db2\u9801\u4e0b\u8f09\u6642\u9593\u5927\u5927\u964d\u4f4e\u3002\u800c\u6211\u5011\u7db2\u7ad9\u4e3b\u9700\u8981\u505a\u7684\uff0c\u5c31\u662f\u5347\u7d1a Web \u4f3a\u670d\u5668\u5230\u652f\u63f4 HTTP\/2\u3002<\/p>\n<h2 id=\"toc_2\">\u5c0d\u7db2\u7ad9\u958b\u767c\u8005\u6703\u6709\u4ec0\u9ebc\u5f71\u97ff\u55ce\uff1f<\/h2>\n<p>\u525b\u624d\u63d0\u5230 Web \u958b\u767c\u8005\u5728 HTTP\/1.1 \u9650\u5236\u4e0b\uff0c\u70ba\u4e86\u6539\u5584\u7db2\u9801\u4e0b\u8f09\u901f\u5ea6\u767c\u5c55\u51fa\u4e86\u5404\u7a2e\u5947\u6280\u6deb\u5de7\uff0c\u5176\u4e2d\u56e0\u70ba HTTP\/1.1 \u4e00\u500b HTTP Requests \u8acb\u6c42\uff0c\u5c31\u6703\u4f54\u7528\u4e00\u500b\u7db2\u8def\u9023\u7dda\uff0c\u6240\u4ee5\u6709\u5f88\u591a\u62db\u6578\u90fd\u662f\u60f3\u6e1b\u5c11 Requests \u7684\u6578\u91cf\uff0c\u8b93\u6211\u5011\u4f86\u770b\u770b\u6709\u54ea\u4e9b\uff1a<\/p>\n<ul>\n<li>\u5408\u4f75\u5716\u7247(<a href=\"https:\/\/css-tricks.com\/css-sprites\/\">Image Sprites<\/a>)\uff0c\u70ba\u4e86\u6e1b\u5c11\u700f\u89bd\u5668\u767c\u9001 Requests \u7684\u6578\u91cf\uff0c\u5c31\u628a\u5f88\u591a\u5c0f\u5716(\u4f8b\u5982Icon)\u5408\u4f75\u6210\u4e00\u5f35\u5927\u5716\u4e0b\u8f09\uff0c\u7136\u5f8c\u900f\u904e CSS \u6a23\u5f0f\u53bb\u5207\u51fa\u5176\u4e2d\u4e00\u500b\u5c0f\u5716\u3002\u9019\u4e00\u62db\u7528\u8d77\u4f86\u5176\u5be6\u5f88\u9ebb\u7169\uff0c\u56e0\u70ba\u6bcf\u6b21\u65b0\u589e\u5c0f\u5716\u6216\u4fee\u6539\uff0c\u6574\u5f35\u5927\u5716\u90fd\u8981\u91cd\u65b0\u7522\u751f\u904e\u3002<\/li>\n<li>\u5408\u4f75 CSS \u548c JavaScript \u6a94\u6848\uff0c\u4e5f\u662f\u70ba\u4e86\u6e1b\u5c11\u700f\u89bd\u5668\u767c\u9001 Requests \u7684\u6578\u91cf\u3002\u4f46\u662f\u958b\u767c\u7684\u6642\u5019\u4e00\u5b9a\u6703\u62c6\u6210\u4e0d\u540c\u6a94\u6848\u624d\u6bd4\u8f03\u597d\u7dad\u8b77\uff0c\u800c\u6700\u5f8c\u4f48\u7f72\u5230\u4f3a\u670d\u5668\u6642\uff0c\u9700\u8981\u984d\u5916\u53bb\u9032\u884c\u628a\u6a94\u6848\u5408\u4f75\u7684\u52d5\u4f5c\u3002<\/li>\n<li>\u5167\u63d2 CSS\u3001JavaScript \u6216\u5716\u7247\uff0c\u4e5f\u662f\u70ba\u4e86\u6e1b\u5c11\u700f\u89bd\u5668\u767c\u9001 Requests \u7684\u6578\u91cf\uff0c\u5c31\u628a\u539f\u672c\u61c9\u8a72\u7368\u7acb\u7684\u6a94\u6848\uff0c\u76f4\u63a5\u5167\u63d2\u5230 HTML \u88e1\u9762\u3002\u5716\u7247\u6703\u7528 Base64 \u7de8\u78bc\u6210\u7d14\u6587\u5b57\u5f8c\u7f6e\u5165\u3002\u4f46\u9019\u62db\u6703\u7834\u58de\u700f\u89bd\u5668\u5feb\u53d6\u6a5f\u5236\uff0c\u672c\u4f86\u662f\u53ef\u4ee5\u55ae\u7368\u5feb\u53d6\u9019\u4e9b\u975c\u614b\u8cc7\u6e90\u7684\uff0c\u5167\u63d2\u5f8c\u53cd\u800c\u6c92\u6709\u5feb\u53d6\u4e86\uff0c\u800c\u4e14\u5716\u7247\u5be6\u969b\u5927\u5c0f\u6703\u8b8a\u5927\u6d6a\u8cbb\u983b\u5bec\u3002<\/li>\n<li>Domain \u5207\u5206(Domain Sharding)\uff0c\u700f\u89bd\u5668\u91dd\u5c0d\u540c\u4e00\u500b\u7db2\u5740\u53ea\u80fd\u958b\u516d\u500b\u7db2\u8def\u9023\u7dda\uff0c\u70ba\u4e86\u7a81\u7834\u9019\u500b\u9650\u5236\uff0c\u7db2\u7ad9\u8005\u53ef\u80fd\u6703\u62c6\u591a\u500b\u5b50\u7db2\u57df\uff0c\u7528\u4e0d\u540c\u7db2\u5740\u4f86\u4e0b\u8f09\u5716\u7247\u3002\u53e6\u5916\u4e5f\u56e0\u70ba\u62c6\u5206\u4e0d\u540c Domain \u7684\u95dc\u4fc2\uff0c\u53ef\u4ee5\u8b93\u700f\u89bd\u5668\u7684 Cookie \u4e0d\u6703\u9001\u5230\u9019\u4e9b\u6b21\u8981\u7db2\u57df\uff0c\u6e1b\u5c11\u4e00\u9ede\u983b\u5bec\u6d6a\u8cbb\u3002<\/li>\n<\/ul>\n<p>\u4ee5\u4e0a\u9019\u4e9b\u6280\u5de7\uff0c\u90fd\u6703\u8b93\u7db2\u7ad9\u958b\u767c\u548c\u4f48\u7f72\u589e\u52a0\u4e0d\u5c11\u984d\u5916\u7684\u9ebb\u7169\uff0c\u800c\u5728 HTTP\/2 \u901a\u8a0a\u5354\u5b9a\u4e0b\uff0c\u90fd\u5df2\u7d93\u8b8a\u5f97\u4e0d\u9700\u8981\u4e86 (\u6b61\u547c!)<\/p>\n<h2 id=\"toc_3\">\u9700\u8981 HTTPS \u52a0\u5bc6\u9023\u7dda<\/h2>\n<p>\u70ba\u4e86\u80fd\u5920\u9806\u5229\u8b93\u700f\u89bd\u5668\u80fd\u76f8\u5bb9\u73fe\u5b58\u7684 HTTP \u7db2\u7ad9(\u4f7f\u7528\u901a\u8a0a\u57e0 Port 80)\uff0c\u6240\u4ee5 HTTP\/2 \u9078\u64c7\u4f48\u7f72\u5728 HTTPS (\u4f7f\u7528\u901a\u8a0a\u57e0 Port 443) \u4e0a\uff0c\u56e0\u6b64\u5728\u5b89\u88dd HTTP\/2 \u7684\u6b65\u9a5f\u4e2d\uff0c\u8981\u5148\u64c1\u6709 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49\u3002\u53e6\u4e00\u65b9\u9762\uff0c\u9019\u4e5f\u662f\u5168\u9762\u63a8\u5ee3\u7db2\u7ad9\u5b89\u5168\u7684\u5951\u6a5f\uff0c\u9664\u4e86\u6709\u66f4\u5feb\u901f\u5ea6\uff0c\u540c\u6642\u4e5f\u8981\u6c42\u4e86\u66f4\u597d\u7684\u7db2\u8def\u5b89\u5168\u3002<\/p>\n<p>\u4f7f\u7528 HTTPS \u52a0\u5bc6\u9023\u7dda\u7684\u597d\u8655\u6709\uff1a<\/p>\n<ul>\n<li>\u4fdd\u8b77\u700f\u89bd\u5668\u548c\u4f3a\u670d\u5668\u4e4b\u9593\u7684\u50b3\u8f38\uff0c\u4e0d\u6703\u88ab\u5225\u4eba\u4fee\u6539\u3002\u9019\u4e0d\u4e00\u5b9a\u6307\u60e1\u610f\u7684\u99ed\u5ba2 <a href=\"https:\/\/zh.wikipedia.org\/wiki\/%E4%B8%AD%E9%97%B4%E4%BA%BA%E6%94%BB%E5%87%BB\">\u4e2d\u9593\u4eba\u653b\u64ca<\/a>\uff0c\u4e5f\u53ef\u80fd\u53ea\u662f\u60f3\u63d2\u5165\u5ee3\u544a\u3002\u4f8b\u5982\u6709\u4e9b\u5496\u5561\u5e97\u7684\u514d\u8cbb Wifi \u6703\u5728\u7db2\u9801\u4e0a\u9762\u63d2\u5165\u5ee3\u544a\u3002\u4f46\u662f\u5982\u679c\u662f HTTPS \u7db2\u7ad9\u5c31\u6c92\u8fa6\u6cd5\u4e86\u3002<\/li>\n<li>\u4fdd\u8b77\u4e86\u4f7f\u7528\u8005\u7684\u96b1\u79c1\u5b89\u5168\uff0c\u4e0d\u6703\u88ab\u4eba\u7aca\u807d\u3002\u7279\u5225\u662f\u9700\u8981\u767b\u5165\u7684\u7db2\u7ad9\uff0c\u6c92\u6709 HTTPS \u52a0\u5bc6\uff0c\u975e\u5e38\u5bb9\u6613\u5c31\u53ef\u4ee5\u88ab\u4eba\u7aca\u53d6\u5e33\u865f\u5bc6\u78bc\u3002<\/li>\n<li>Google \u628a HTTPS \u7684\u7db2\u7ad9\u7576\u4f5c <a href=\"https:\/\/webmasters.googleblog.com\/2014\/08\/https-as-ranking-signal.html\">SEO \u52a0\u5206<\/a><\/li>\n<li>\u5f88\u591a\u65b0\u7684\u700f\u89bd\u5668\u529f\u80fd\u4e5f\u958b\u59cb\u628a HTTPS \u7576\u4f5c\u5fc5\u8981\u689d\u4ef6\uff0c\u4f8b\u5982 <a href=\"https:\/\/developers.google.com\/web\/updates\/2016\/04\/geolocation-on-secure-contexts-only\">Geolocation \u5b9a\u4f4d<\/a>\u3001<a href=\"http:\/\/www.html5rocks.com\/en\/tutorials\/service-worker\/introduction\/\">ServiceWorker<\/a> \u7b49\u7b49\u529f\u80fd<\/li>\n<li><a href=\"https:\/\/techcrunch.com\/2016\/06\/14\/apple-will-require-https-connections-for-ios-apps-by-the-end-of-2016\/\">Apple \u5ba3\u5e03<\/a> 2016 \u5e74\u5e95\uff0c\u6240\u6709 iOS app \u7684\u7db2\u8def\u9023\u7dda\u90fd\u5fc5\u9808\u7528\u52a0\u5bc6\u9023\u7dda HTTPS\uff0c\u4e0d\u53ef\u4ee5\u7528 HTTP \u4e86\u3002<\/li>\n<\/ul>\n<p>\u7d9c\u5408\u4ee5\u4e0a\uff0cHTTPS \u52a0\u5bc6\u9023\u7dda\u53ef\u8aaa\u662f\u7576\u4eca\u61c9\u7528\u7a0b\u5f0f\u7db2\u7ad9\u5fc5\u5099\u7684\u57fa\u672c\u5b89\u5168\u9700\u6c42\u3002<\/p>\n<h2 id=\"toc_4\">\u5982\u4f55\u5b89\u88dd HTTP\/2<\/h2>\n<h4>\u7b2c\u4e00\u6b65\uff1a\u53d6\u5f97 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49<\/h4>\n<p>\u9996\u5148\u8981\u53d6\u5f97 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49\u6a94\u6848\u3002\u9019\u500b\u6191\u8b49\u662f\u4e0d\u80fd\u81ea\u5df1\u7c3d\u767c\u7684\uff0c\u9019\u6a23\u700f\u89bd\u5668\u6703\u6709\u8b66\u544a\u756b\u9762\uff1a<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" data-attachment-id=\"8768\" data-permalink=\"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2\/https-error-600x484\" data-orig-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484.png\" data-orig-size=\"600,484\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"https-error-600&amp;#215;484\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484-300x242.png\" data-large-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484.png\" src=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484.png\" alt=\"\" width=\"600\" height=\"484\" class=\"alignnone size-full wp-image-8768\" srcset=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484.png 600w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-error-600x484-300x242.png 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>\u65e9\u5148 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49\u4e00\u5b9a\u662f\u5411\u6191\u8b49\u6a5f\u69cb\u8cfc\u8cb7\uff0c\u9019\u6a23\u700f\u89bd\u5668\u624d\u6703\u8a8d\u5f97\u4f60\u662f\u5408\u6cd5\u7684\u6191\u8b49(\u9019\u4e9b\u700f\u89bd\u5668\u5728\u51fa\u5ee0\u6642\u5c31\u5df2\u7d93\u8a2d\u5b9a\u597d\u8981\u76f8\u4fe1\u54ea\u4e9b\u6191\u8b49\u6a5f\u69cb)\uff0c\u4f8b\u5982 alphacamp.co \u662f\u5728 <a href=\"https:\/\/www.namecheap.com\/?aff=91800\">NameCheap<\/a> \u9019\u5bb6\u4ee3\u7406\u5546\u8cfc\u8cb7\u7684\u3002\u597d\u6d88\u606f\u662f\uff0c\u70ba\u4e86\u63a8\u5ee3 HTTPS \u5b89\u5168\u9023\u7dda\uff0c\u53bb\u5e74\u7531\u8a31\u591a\u5927\u516c\u53f8\u4ee5\u53ca\u5404\u5927\u975e\u71df\u5229\u5718\u9ad4\u5171\u540c\u8d0a\u52a9\u63a8\u51fa <a href=\"https:\/\/letsencrypt.org\/\">Let&#39;s Encrypt<\/a> \u9019\u500b\u670d\u52d9\uff0c<strong>\u514d\u8cbb<\/strong>\u767c\u4f48 TLS\/SSL \u6191\u8b49\u3002\u4e2d\u6587\u4f7f\u7528\u8aaa\u660e\u53ef\u4ee5\u53c3\u8003 <a href=\"https:\/\/letsencrypt.tw\/\">letsencrypt.tw\/<\/a>\uff0c\u6216\u662f\u7528 <a href=\"https:\/\/certbot.eff.org\/\">certbot<\/a> \u9019\u500b\u5de5\u5177\u3002\u4e0d\u904e\u56e0\u70ba\u5b83\u7684\u4f7f\u7528\u65b9\u5f0f\uff0c\u8ddf\u4e00\u822c\u6211\u5011\u5728\u6191\u8b49\u6a5f\u69cb\u7db2\u7ad9\u4e0a\u8cfc\u8cb7\u7684\u6b65\u9a5f\u4e0d\u592a\u4e00\u6a23\uff0c\u9700\u8981\u5728\u4e3b\u6a5f\u4e0a\u4e0b\u6307\u4ee4\u4f86\u53d6\u5f97\u6191\u8b49\uff0c\u6240\u4ee5\u4e5f\u6709\u4eba\u8a2d\u8a08\u4e86\u4e00\u500b\u7dda\u4e0a\u5de5\u5177 <a href=\"https:\/\/www.sslforfree.com\/\">SSL For Free<\/a> \u53ef\u4ee5\u5728\u7dda\u4e0a\u5c31\u5b8c\u6210\u6191\u8b49\u7533\u8acb\u3002<\/p>\n<h4>\u7b2c\u4e8c\u6b65\uff1a\u8a2d\u5b9a Web \u4f3a\u670d\u5668<\/h4>\n<p>\u63a5\u8457\u8a2d\u5b9a Web \u4f3a\u670d\u5668\u3002Apache \u53ef\u4ee5\u4f7f\u7528 <a href=\"https:\/\/httpd.apache.org\/docs\/2.4\/mod\/mod_http2.html\">mod_http2<\/a>\uff0c\u800c Nginx \u5728 <a href=\"https:\/\/nginx.org\/\">1.10 stable<\/a> \u5f8c\u5c31\u5167\u5efa\u652f\u63f4\u4e86(\u5efa\u8b70\u7528 mainline branch \u7684\u7248\u672c\uff0c\u4e5f\u5c31\u662f 1.11)\u3002\u8a2d\u5b9a SSL \u7684\u8a2d\u5b9a\u6a94\u53ef\u4ee5\u53c3\u8003 <a href=\"https:\/\/mozilla.github.io\/server-side-tls\/ssl-config-generator\/\">Mozilla SSL Configuration Generator<\/a> \u7684\u5efa\u8b70\uff0c\u5176\u4e2d\u9664\u4e86\u8a2d\u5b9a\u4f60\u6191\u8b49\u7684\u6a94\u6848\u4f4d\u7f6e\u4e4b\u5916\uff0c\u9084\u53ef\u4ee5\u8b93\u4f3a\u670d\u5668\u6253\u958b HSTS \u9019\u500b HTTP Header\uff0c\u544a\u8a34\u700f\u89bd\u5668\u9019\u500b\u7db2\u7ad9\u53ea\u7528 HTTPS \u52a0\u5bc6\u9023\u7dda\uff0c\u4e0d\u8981\u7528 HTTP\uff0c\u9019\u6a23\u4f7f\u7528\u8005\u5c31\u4e0d\u6703\u4e0d\u5c0f\u5fc3\u7528\u5230 HTTP \u4e0d\u5b89\u5168\u7684\u9023\u7dda\u4e86\u3002\u4f46\u662f\u8981\u6ce8\u610f\u4e00\u65e6\u555f\u7528\uff0c\u671f\u9650\u5167\u5c31\u6c92\u6709\u8fa6\u6cd5\u8b93\u4f7f\u7528\u8005\u6539\u56de\u7528 HTTP \u56c9\uff0c\u5efa\u8b70\u53ef\u4ee5\u5728\u6700\u5f8c\u5168\u7ad9\u6aa2\u67e5\u6c92\u554f\u984c\u5f8c\u518d\u555f\u7528\u3002\u53e6\u5916\u9084\u6709\u4e00\u9ede\u8981\u6ce8\u610f\uff0c\u5c31\u662f\u4f3a\u670d\u5668\u4e0a\u7684 OpenSSL \u51fd\u5f0f\u5eab\u9700\u8981\u5347\u7d1a\u5230 1.0.2g\uff0c\u4f60\u53ef\u4ee5\u5728\u7de8\u8b6f Nginx \u6642\u7279\u5225\u642d\u914d\u9019\u500b\u7248\u672c\uff0c\u6216\u662f\u4e7e\u8106\u4f7f\u7528\u8f03\u65b0\u7684 Ubuntu Linux 16.04 \u4f3a\u670d\u5668\u4f5c\u696d\u7cfb\u7d71\uff0c\u8a73\u60c5\u8acb\u53c3\u8003 <a href=\"https:\/\/www.nginx.com\/blog\/supporting-http2-google-chrome-users\/\">Supporting HTTP\/2 for Google Chrome Users<\/a> \u9019\u7bc7\u6587\u7ae0\u7684\u8aaa\u660e\u3002<\/p>\n<p>\u5982\u679c\u4e0a\u8ff0\u7684\u5169\u500b\u6b65\u9a5f\u9084\u662f\u592a\u9ebb\u7169\uff0c\u6216\u662f\u4f60\u6c92\u6709\u7ba1\u7406\u4f3a\u670d\u5668\u7684\u7d93\u9a57\uff0c\u7b46\u8005\u63a8\u85a6\u53ef\u4ee5\u4f7f\u7528 <a href=\"https:\/\/www.cloudflare.com\/plans\/\">CloudFlare<\/a> \u9019\u500b\u7db2\u7ad9\u52a0\u901f\u670d\u52d9(CDN)\uff0c\u5b83\u6709<strong>\u514d\u8cbb\u65b9\u6848<\/strong>\u63d0\u4f9b TLS\/SSL \u6191\u8b49\u4ee5\u53ca HTTP\/2 \u9023\u7dda\u3002\u4e5f\u5c31\u662f\u8aaa\u4f60\u7684\u7db2\u7ad9\u4f3a\u670d\u5668\u53ef\u4ee5\u4ec0\u9ebc\u90fd\u4e0d\u7528\u6539\uff0c\u53ea\u9700\u8981\u4fee\u6539 DNS \u8b93\u4f7f\u7528\u8005\u7684\u9023\u7dda\u6703\u5148\u7d93\u904e CloudFlare \u4f3a\u670d\u5668\u5373\u53ef\u3002\u4f7f\u7528\u8005\u5230 CloudFlare \u7684\u9019\u4e00\u6bb5\u50b3\u8f38\uff0c\u5c31\u6703\u662f\u6709\u52a0\u5bc6\u7684 HTTP\/2 \u9023\u7dda\u3002CloudFlare \u5728\u5168\u7403\u5404\u5730\u90fd\u6709\u7bc0\u9ede\uff0c\u4eca\u5e74\u56db\u6708\u4e5f\u7d42\u65bc\u5728\u53f0\u5317\u4f48\u9ede\u4e86\uff0c\u6240\u4ee5\u7db2\u8def\u901f\u5ea6\u975e\u5e38\u597d\u3002<\/p>\n<h4>\u7b2c\u4e09\u6b65\uff1a\u66ff\u63db HTTP \u7db2\u5740\u70ba HTTPS<\/h4>\n<p>\u6211\u5011\u9700\u8981\u5c07\u6240\u6709 HTTP \u7db2\u5740\u90fd\u63db\u6210 HTTPS \u7db2\u5740\u3002\u7db2\u9801\u4e0a\u6240\u6709\u9023\u5230\u81ea\u5df1\u7db2\u7ad9\u7684\u8d85\u9023\u7d50\u3001\u5716\u7247\u3001JavaScript \u548c CSS \u7b49\u7b49\u7db2\u5740\uff0c\u90fd\u5fc5\u9808\u4fee\u6539\u6210 https:\/\/ \u958b\u982d\u3002\u800c\u6240\u6709\u5916\u90e8\u7cfb\u7d71\u4e2d\u4f60\u7684\u7db2\u5740\uff0c\u4f8b\u5982 Facebook \u5ee3\u544a\u3001Google Analytics \u548c\u5176\u4ed6\u7db2\u7ad9\u5206\u6790\u8ffd\u8e64\u5de5\u5177\uff0c\u90fd\u5fc5\u9808\u628a\u7db2\u5740\u6539\u6210 https:\/\/ \u958b\u982d\u3002<\/p>\n<h4>\u7b2c\u56db\u6b65\uff1a\u6700\u5f8c\u6aa2\u67e5<\/h4>\n<p>\u5148\u6aa2\u67e5 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49\u5b89\u88dd\u6b63\u78ba\uff0c\u53ef\u4ee5\u4f7f\u7528 <a href=\"https:\/\/www.ssllabs.com\/ssltest\/\">SSL Server Test<\/a> \u9019\u500b\u7dda\u4e0a\u5de5\u5177\u3002\u63a5\u8457\u6aa2\u67e5 HTTP\/2 \u6709\u555f\u7528\uff0c\u4f7f\u7528 Chrome \u700f\u89bd\u5668\u5728\u7db2\u5740\u8f38\u5165 <a href=\"\" class=\"autohyperlink\"><\/a> \u89c0\u5bdf\u6709\u54ea\u4e9b\u7db2\u7ad9\u5728\u4f7f\u7528 HTTP\/2\uff0c\u6216\u662f\u4f60\u53ef\u4ee5\u5b89\u88dd <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/http2-and-spdy-indicator\/mpbpobfflnpcgagjijhmgnchggcjblin?hl=en\">HTTP\/2 and SPDY Indicator<\/a>\u3002\u7dda\u4e0a\u6e2c\u8a66\u5de5\u5177\u5247\u53ef\u4ee5\u7528 <a href=\"https:\/\/tools.keycdn.com\/http2-test\">HTTP\/2 Test<\/a>\u3002\u66f4\u591a\u5de5\u5177\u53ef\u4ee5\u53c3\u8003 <a href=\"https:\/\/blog.cloudflare.com\/tools-for-debugging-testing-and-using-http-2\">Tools for debugging, testing and using HTTP\/2<\/a>\u3002<\/p>\n<h4>\u7b2c\u4e94\u6b65\uff1a\u5168\u9762\u555f\u7528<\/h4>\n<p>\u6aa2\u67e5\u6c92\u6709\u554f\u984c\u5f8c\uff0c\u6211\u5011\u53ef\u4ee5\u8a2d\u5b9a Web \u4f3a\u670d\u5668\u53ea\u5141\u8a31 HTTPS \u9023\u7dda\uff0c\u6240\u6709\u9023\u7dda\u5230 HTTP \u7684\u60c5\u6c42\uff0c\u5168\u90e8\u8f49\u5740(301 Redirect)\u5230 HTTPS \u9023\u7dda\uff0c\u4e26\u4e14\u6253\u958b HSTS \u9019\u500b HTTP Header \u5f37\u5236\u4f7f\u7528\u8005\u700f\u89bd\u5668\u53ea\u80fd\u7528 HTTPS \u9023\u7dda\u3002<\/p>\n<p>\u6700\u5f8c\u7684\u6210\u679c\u5c31\u662f\u6703\u6709\u4e00\u500b\u7da0\u8272\u7684 Icon \u51fa\u73fe\u5728\u7db2\u5740\u5217\uff1a<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" data-attachment-id=\"8767\" data-permalink=\"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2\/https-ok\" data-orig-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok.png\" data-orig-size=\"414,80\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"https-ok\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok-300x58.png\" data-large-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok.png\" src=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok.png\" alt=\"\" width=\"414\" height=\"80\" class=\"alignnone size-full wp-image-8767\" srcset=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok.png 414w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-ok-300x58.png 300w\" sizes=\"auto, (max-width: 414px) 100vw, 414px\" \/><\/p>\n<h2 id=\"toc_5\">\u5c0e\u5165\u7684\u56f0\u96e3\u9ede\u662f\uff1f<\/h2>\n<p>\u770b\u8d77\u4f86\u597d\u50cf\u5f88\u7c21\u55ae\uff0c\u5c31\u662f\u8a2d\u5b9a\u5c31\u53ef\u4ee5\u4e86\uff0c\u6709\u6c92\u6709\u4ec0\u9ebc\u56f0\u96e3\u9ede\u5462\uff1f\u7b46\u8005\u8a8d\u70ba\u8655\u7406 TLS\/SSL \u5b89\u5168\u6027\u6191\u8b49\u53ea\u662f\u5c0f\u9ebb\u7169\u800c\u5df2\uff0c\u66f4\u4f55\u6cc1\u5982\u679c\u7528 <a href=\"https:\/\/www.cloudflare.com\/plans\/\">CloudFlare<\/a> \u9023\u7533\u8acb\u6191\u8b49\u7684\u6b65\u9a5f\u90fd\u4e0d\u9700\u8981\u3002\u771f\u6b63\u6703\u9ebb\u7169\u7684\u5730\u65b9\uff0c\u6050\u6015\u9084\u662f\u5f9e HTTP \u6539\u6210 HTTPS \u7684\u9019\u500b\u904e\u7a0b\u6703\u6bd4\u8f03\u8f9b\u82e6\u3002\u5982\u679c\u4f60\u672c\u4f86\u5c31\u4e0d\u662f\u5168\u7ad9\u8d70 HTTPS \u901a\u8a0a\u5354\u5b9a\uff0c\u4e00\u65e6\u5f9e HTTP \u63db\u6210 HTTPS\uff0c\u5c31\u5f88\u5bb9\u6613\u78b0\u5230 <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/Security\/Mixed_content\">Mixed content<\/a> \u6df7\u5408\u5167\u5bb9\u7684\u700f\u89bd\u5668\u8b66\u544a\uff0c\u610f\u601d\u662f\u8aaa\u4f60\u5728\u52a0\u5bc6\u7684 HTTPS \u7684\u7db2\u9801\u4e4b\u4e2d\uff0c\u4f7f\u7528\u5230\u975e\u52a0\u5bc6\u7684 HTTP \u7684\u8cc7\u6e90\uff0c\u9019\u500b\u8cc7\u6e90\u53ef\u80fd\u662f JavaScript\u3001CSS\u3001\u5716\u7247\u6216\u662f iframe (\u4e0d\u5305\u62ec\u8d85\u9023\u7d50)\u3002<\/p>\n<p>\u5982\u679c\u53ea\u662f\u5716\u7247\u548c\u5f71\u7247\u7528\u5230\u975e\u52a0\u5bc6\u7684 HTTP \u7db2\u5740\uff0c\u90a3\u9ebc\u700f\u89bd\u5668\u7684\u7da0\u8272\u5b89\u5168\u9470\u5319 Icon \u5c31\u6703\u4e0d\u898b\uff1a<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" data-attachment-id=\"8766\" data-permalink=\"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2\/https-mixed-content\" data-orig-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content.png\" data-orig-size=\"410,166\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"https-mixed-content\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content-300x121.png\" data-large-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content.png\" src=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content.png\" alt=\"\" width=\"410\" height=\"166\" class=\"alignnone size-full wp-image-8766\" srcset=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content.png 410w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2017\/07\/https-mixed-content-300x121.png 300w\" sizes=\"auto, (max-width: 410px) 100vw, 410px\" \/><\/p>\n<p>\u4f46\u5982\u679c\u662f CSS \u6216 JavaScript \u7684\u8a71\uff0c\u90a3\u700f\u89bd\u5668\u5c31\u6839\u672c\u4e0d\u8f09\u5165\u4e86\uff0c\u4f60\u7684\u7db2\u9801\u5c31\u6703\u7834\u7248\u7121\u6cd5\u6b63\u5e38\u904b\u4f5c\u3002<\/p>\n<p>\u56e0\u6b64\uff0c\u70ba\u4e86\u4e0d\u8981\u8b93\u700f\u89bd\u5668\u51fa\u73fe\u9019\u500b\u8b66\u544a\uff0c\u8b93\u6240\u6709\u5e73\u53f0\u4e0b\u7684\u700f\u89bd\u5668\u4e0b\u90fd\u53ef\u4ee5\u6b63\u5e38\u904b\u4f5c\uff0c\u4f60\u5f97\u5c07 HTTPS \u7db2\u9801\u4e2d\u7684\u6240\u6709\u8cc7\u6e90\uff0c\u90fd\u4e00\u4e00\u6aa2\u67e5\u5c07 HTTP \u66ff\u63db\u6210 HTTPS\u3002\u5982\u679c\u7576\u521d\u662f\u7528\u76f8\u5c0d\u7db2\u5740\u5c31\u6c92\u4e8b\uff0c\u4f46\u662f\u5982\u679c\u6709\u7528\u5230\u7d55\u5c0d\u7db2\u5740 http:\/\/ \u958b\u982d\u7684\uff0c\u4f8b\u5982\u76f4\u63a5\u9023\u7d50\u4f7f\u7528\u5176\u4ed6\u7db2\u7ad9\u7684\u8cc7\u6e90\uff0c\u90a3\u6539\u8d77\u4f86\u53ef\u80fd\u5c31\u6703\u5f88\u9ebb\u7169\u8cbb\u4e8b\uff0c\u800c\u4e14\u5bb9\u6613\u767e\u5bc6\u4e00\u758f\u3002\u53e6\u5916\uff0c\u4e5f\u8981\u6559\u80b2\u8a13\u7df4\u4e00\u4e0b\u76f8\u95dc\u7de8\u8f2f\u7db2\u9801\u7684\u540c\u4e8b\uff0c\u4e0d\u7136\u4e00\u4e0d\u5c0f\u5fc3\u7da0\u8272\u5b89\u5168\u9470\u5319 Icon \u53c8\u4e0d\u898b\u4e86\u3002<\/p>\n<p>\u5982\u679c\u662f\u6b77\u53f2\u5927\u7ad9\uff0c\u9019\u6a23\u5347\u7d1a\u53ef\u80fd\u662f\u771f\u7684\u6539\u4e0d\u5b8c\uff0c\u4e00\u500b\u904e\u5ea6\u7684\u65b9\u6848\u662f\u4f7f\u7528 <a href=\"https:\/\/www.w3.org\/TR\/upgrade-insecure-requests\/\">upgrade-insecure-requests<\/a> \u5e6b\u5fd9\uff0c\u900f\u904e\u5728 Web \u4f3a\u670d\u5668\u4e0a\u8a2d\u5b9a\u9019\u500b HTTP header\uff0c\u700f\u89bd\u5668\u5c31\u6703\u81ea\u52d5\u5c07\u7db2\u9801\u4e0a\u7684 HTTP \u8cc7\u6e90\u81ea\u52d5\u66ff\u63db\u6210 HTTPS \u7db2\u5740\u3001\u7ad9\u5167\u7684\u8d85\u9023\u7d50\u4e5f\u6703\u81ea\u52d5\u66ff\u63db\u6210 HTTPS\u3002\u4e0d\u904e\u9019\u500b HTTP header \u9700\u8981\u700f\u89bd\u5668\u652f\u6301\uff0c\u652f\u63f4\u5ea6\u53ef\u4ee5\u53c3\u8003 <a href=\"http:\/\/caniuse.com\/#feat=upgradeinsecurerequests\">Can I Use?<\/a>\u3002<\/p>\n<p>\u95dc\u65bc Mixed content\uff0cGoogle Developer \u7db2\u7ad9\u4e0a\u4e5f\u6709\u4e00\u7bc7\u5b8c\u6574\u7684\u6559\u5b78 <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/security\/prevent-mixed-content\/fixing-mixed-content\">Fixing mixed Content<\/a>\u3002<\/p>\n<p>\u53e6\u5916\u9084\u6709\u4e00\u4e9b\u81ea\u5df1\u4e0d\u53ef\u89e3\u7684\u554f\u984c\uff0c\u4f8b\u5982\u4f7f\u7528\u5230\u7b2c\u4e09\u65b9\u670d\u52d9\u7684\u8cc7\u6e90\uff0c\u4f8b\u5982 iframe \u6216 javascript \u7684 widget \uff0c\u800c\u8a72\u670d\u52d9\u4e0d\u5920\u9032\u6b65(\u8acb\u5beb\u4fe1\u7d66\u5c0d\u65b9\u62b1\u6028\uff0c\u9644\u4e0a\u9019\u7bc7\u6587\u7ae0\u7684\u8d85\u9023\u7d50) \u7adf\u7136\u6c92\u6709\u63d0\u4f9b HTTPS \u9023\u7dda\uff0c\u9019\u6a23\u5c31\u6c92\u8fa6\u6cd5\u6574\u5408\u9032\u4f60\u7684\u7db2\u9801\u4e86\uff0c\u9664\u975e\u4f60\u81ea\u5df1\u641e\u500b\u4ee3\u7406\u4f3a\u670d\u5668\uff0c\u4f46\u9019\u4e5f\u592a\u9ebb\u7169\u4e86\uff0c\u4e0d\u5982\u63db\u4e00\u5bb6\u66f4\u597d\u7684\u7b2c\u4e09\u65b9\u670d\u52d9\u3002<\/p>\n<p>\u4ee5\u4e0a\u5411\u5927\u5bb6\u4ecb\u7d39 HTTP\/2 \u901a\u8a0a\u5354\u5b9a\uff0c\u5e0c\u671b\u6709\u8d8a\u4f86\u8d8a\u591a\u7684\u7db2\u7ad9\u90fd\u958b\u59cb\u4f7f\u7528 HTTP\/2\uff0c\u8b93\u6211\u5011\u7684\u7db2\u8def\u74b0\u5883\u66f4\u5feb\u66f4\u5b89\u5168\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>(\u672c\u6587 crossposting \u65bc ALPHACamp Blog) \u5982\u679c\u8aaa\u6709\u4e00\u9805\u6280\u8853\u53ef\u4ee5\u8b93\u4f60\u7684\u7db2\u7ad9\u700f\u89bd\u8d77\u4f86\u66f4 &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/ihower.tw\/blog\/8489-%e6%9b%b4%e5%bf%ab%e6%9b%b4%e5%ae%89%e5%85%a8-%e6%af%8f%e5%80%8b%e7%b6%b2%e7%ab%99%e9%83%bd%e6%87%89%e8%a9%b2%e5%8d%87%e7%b4%9a%e5%88%b0-http2\" class=\"more-link\">\u95b1\u8b80\u5168\u6587<span class=\"screen-reader-text\">\u3008\u66f4\u5feb\u66f4\u5b89\u5168: \u6bcf\u500b\u7db2\u7ad9\u90fd\u61c9\u8a72\u5347\u7d1a\u5230 HTTP\/2\u3009<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":true,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[31],"tags":[],"class_list":["post-8489","post","type-post","status-publish","format-standard","hentry","category-ruby","entry"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p1q6tG-2cV","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/8489","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/comments?post=8489"}],"version-history":[{"count":10,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/8489\/revisions"}],"predecessor-version":[{"id":8770,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/8489\/revisions\/8770"}],"wp:attachment":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/media?parent=8489"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/categories?post=8489"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/tags?post=8489"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}