摘要：為了避免那些杯具，網站需要戴上名為的安全套。我也是經網友提醒才給網站增加了以提高安全性，謝謝他。在談安全時，從來就沒有絕對的安全，就像安全套不能百分百避免中標。要想使自己的網站時刻保持相對安全的狀態，站長本身就應該是一名黑客。

本文首發于歐雷流《給網站戴上「安全套」》。由于我會時不時對文章進行補充、修正和潤色，為了保證所看到的是最新版本，請閱讀原文。

上周六我去一家售后服務點參加了「冬日保養計劃」，雖然現在是春天……這是牛電科技為小牛電動車車主所提供的一個售后服務，在去年 11 月 25 日之前購入的可以對車子進行一次免費保養，同時還贈送了一份人車保險——「牛油保」。不得不說，雖然各方面有些不足，但小牛做得還是不錯的！

不像其他電動車廠商，小牛對用戶的安全問題比較重視，所以推出了這個計劃和保險。昨天下班時，手機收到了一條由牛電科技發來的短信。

就連外界都對我們的安全那么關心，我們有什么理由不去注重自己的安全呢？不僅僅是自身，還應該包括與自己相關的事物的安全，比如網站。

網站安全包含很多方面，本文所要說的是沒什么技術含量的，只需要做一些簡單配置的——你想的沒錯，就是 HTTPS。

就在昨天，我做了一個決定——全站開啟 HTTPS。

雖然是自己的網站，但我也會時不時地訪問一下，體驗并琢磨用戶在瀏覽網站和閱讀文章時的感受。無論是電腦還是手機，總會出現礙眼的東西！

看到圖中右下角那個「中國移動」的圖標沒有？按住可以拖動到屏幕中的任何位置，就像 iOS 提供的那個輔助用的 AssistiveTouch 一樣；點擊后會出現一個顯示剩余流量和流量套餐的彈層。

是不是覺得中國移動特別貼心，在你沒用 WiFi 瀏覽網頁時能夠時刻監控并提醒你剩余流量？如果換做是中國電信，彈出的就是浮窗廣告了，這回你還覺得貼心么？

Too young, too simple! Sometimes naive!

不管你覺得貼不貼心，實際上它們都做了一件極其惡心的事情——HTTP 劫持！無論是作為網站用戶還是作為網站管理員，如果你所在瀏覽的網站已經被網絡運營商劫持了，那么你的數據信息的安全正在遭受威脅！

為了你本人及你的網站著想，我有必要事先聲明一下——

本文中所描述的是配置全站 HTTPS，示例代碼中用的是本站的域名和目錄路徑，并且除了域名都是虛構的，在操作時請替換成自己的。
我認為開啟全站 HTTPS 是條「不歸路」，也就是說，要再改回 HTTP 會有很麻煩的后果。所以，在進行配置之前請再三考慮對你來說是否真的有必要這么做。

如果你選擇繼續往下看，代表已經知道后果并做好相應的心理準備了。

現如今，在訪問一個網站時其網址大多為 http:// 開頭。懂點網絡知識的都知道 HTTP 是不加密的明文傳輸，沒做任何安全保障措施，黑客可以不費吹灰之力就能拿到數據，運營商能夠隨意利用你所訪問的網站做些惡心的小動作。為了避免那些「杯具」，網站需要戴上名為「SSL」的「安全套」。

根據不同的操作系統和服務器環境「戴法」也不盡相同，這里只說 CentOS + Nginx 的情況。

給網站加 SSL 需要證書，在以前都是收費的，而且較貴，這對于個人站長來說無疑是一筆不小的開銷，增加了運營成本。然而現在有很多免費證書，為「全民 HTTPS 時代」提供了極大的方便！我所使用的是「沃通」所提供的免費 SSL 證書。

訪問沃通數字證書商店的申請免費 SSL 證書頁面，填入各項信息后把生成的證書下載到本地；將壓縮包解壓，找到里面的 for Nginx 壓縮包再解壓就是證書文件了。

在進行配置之前，需要將沃通生成的 SSL 證書傳到服務器上。因為我沒安裝任何 FTP 應用，所以使用命令行通過 scp 命令把文件上傳過去。

scp ourai.ws_sha256_cn/for Nginx/1_ourai.ws_bundle.crt user@ourai.ws:/home/www/ourai.ws.crt

scp ourai.ws_sha256_cn/for Nginx/2_ourai.ws.key user@ourai.ws:/home/www/ourai.ws.key

接下來就是修改 Nginx 的配置文件了。可以在服務器上用 vim 命令直接修改，也可以拷貝到本地用 Sublime Text 之類的圖形化編輯器修改完再傳到服務器上。所增加的配置內容主要如下：

server {
  listen       80;
  listen       443 ssl;      # 對 443 端口進行 SSL 加密
  server_name  ourai.ws;
  root         /home/www/site;

  # 沃通生成的 SSL 證書的存放位置
  ssl_certificate           /home/www/ourai.ws.crt;
  ssl_certificate_key       /home/www/ourai.ws.key;
  # 其他 SSL 相關設置
  ssl_session_timeout       10m;
  ssl_protocols             TLSv1 TLSv1.1 TLSv1.2;
  ssl_ciphers               EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES;
  ssl_prefer_server_ciphers on;

  # 所有 HTTP 訪問都永久重定向（301）到 HTTPS
  if ( $scheme = http ) {
    rewrite ^/(.*) https://$server_name/$1 permanent;
  }
}

將配置文件保存并 nginx -s reload 重啟 Nginx，用瀏覽器訪問一下自己的網站看看效果。

很酷很屌有沒有！逼格又上升了一個檔次！！媽媽再也不用擔心我的網站被強行插入了！！！

先別得瑟，這還只是披了一層 HTTPS 的外衣，雖然能夠抵御一些攻擊，但距離真正的 HTTPS 還差點。

在啟用 HTTPS 后，一般會將通過 HTTP 訪問的鏈接跳轉到 HTTPS 的。

用戶在瀏覽器地址欄中輸入網址時基本不會帶協議，而是直接輸入域名，這時瀏覽器會先通過 HTTP 的方式訪問資源從而在沒有進行加密的情況下與服務器建立了連接，黑客會在跳轉到 HTTPS 之前的空隙進行攻擊，即「中間人攻擊」。

你連接到一個免費 WiFi 接入點，然后開始瀏覽網站，訪問你的網上銀行，查看你的支出，并且支付一些訂單。很不幸，你接入的 WiFi 實際上是黑客的筆記本熱點，他們攔截了你最初的 HTTP 請求，然后跳轉到一個你銀行網站一模一樣的釣魚網站。 現在，你的隱私數據暴露給黑客了。

那么，該如何防止自己的用戶在訪問網站時遭遇上述事情呢？給自己的網站再加上一層保護——HSTS

Nginx 中配置起來還是很簡單的，只需在配置了 HTTPS 的 server 塊中加一句 add_header Strict-Transport-Security "max-age=63072000; includeSubdomains; preload";。

server {
  listen       80;
  listen       443 ssl;      # 對 443 端口進行 SSL 加密
  server_name  ourai.ws;
  root         /home/www/site;

  # 沃通生成的 SSL 證書的存放位置
  ssl_certificate           /home/www/ourai.ws.crt;
  ssl_certificate_key       /home/www/ourai.ws.key;
  # 其他 SSL 相關設置
  ssl_session_timeout       10m;
  ssl_protocols             TLSv1 TLSv1.1 TLSv1.2;
  ssl_ciphers               EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES;
  ssl_prefer_server_ciphers on;

  # 主域名和子域名都啟用 HSTS，過期時間為兩年
  add_header Strict-Transport-Security "max-age=63072000; includeSubdomains; preload";

  # 所有 HTTP 訪問都永久重定向（301）到 HTTPS
  if ( $scheme = http ) {
    rewrite ^/(.*) https://$server_name/$1 permanent;
  }
}

別忘記 nginx -s reload 重啟服務器哦！

新建一個標簽頁，打開 Chrome DevTools 切換到「Network」選項卡，「Preserve log」前面打上勾后再次訪問網站，在日志的最上面有兩個看起來相同的網絡請求。

然而它們并不一樣，第一個是 HTTP 請求，第二個是跳轉后的 HTTPS 請求。再仔細點看會發現那個 HTTP 請求的狀態碼變了，不是 301 了，而是從未見過的 307！

這個 307 跳轉不是服務器端進行的，而是瀏覽器識別到網站設置了 HSTS 而自己進行的客戶端跳轉。

如果設置了 HSTS，用戶只要用某個現代瀏覽器通過 HTTPS 的方式訪問過網站一次，以后即使用 HTTP 訪問網站也會在請求到達服務器之前就被瀏覽器攔截并改成 HTTPS 請求服務器。

SSL 就像是安全套，雖提高了安全性卻失去了快感。HTTPS 使從發起請求到看到頁面的步驟加長，響應速度必定比 HTTP 慢，性能也會有所降低。

支持 HTTPS 后，只有當頁面中的靜態資源（圖片、腳本、樣式表等）全部為 https:// 開頭時才會被瀏覽器認為是「安全的」，網址前面會顯示鎖頭圖標。

網上搜出來的啟用 HTTPS 的教程文章基本都只講「如何配置 SSL」而沒有提到「添加 HSTS」。我也是經網友提醒才給網站增加了 HSTS 以提高安全性，謝謝他。:-)

網站就是戰場，是站長與黑客交手的地方。在談「安全」時，從來就沒有絕對的安全，就像安全套不能百分百避免中標。不存在一勞永逸的銀彈，就是見招拆招，正所謂「道高一尺，魔高一丈」，「安全防范」都是「防君子不防小人」。要想使自己的網站時刻保持相對安全的狀態，站長本身就應該是一名黑客。

忽然想起有一本關于前端安全的書買了許久沒看……

我一定會找時間把它看掉的！（這絕逼不是「死亡 flag」……ˊ_>ˋ）