我的全站https之路
背景
很早前就想著升級https
,總覺得會很難自己想用nginx但是也沒用過不會弄就一直拖著,前兩天突然決定搞一下,沒想到一天多時間就搞完了,所以人還是要多嚐試,有這個想法還沒搞的人要趕快動起來啦。這裏記錄一下防止後麵自己在搞還要去查資料。
網站是自己個人的網站,後台用的 nodejs
,服務器用的阿裏雲的 ECS
,操作係統是linux - centOS。
目的
網上介紹好處的文章很多,我自己升級主要是為了幾個方麵
- ios 之前做網頁用到手機定位,以及現在用
react-native
,很多時候都要https
才可以。 - 微信小程序很多地方也要求
https
。 - 最重要的一點。。看到自己網站前麵有個 不安全 的標誌,感覺很不爽。
流程
自己的站點比較簡單,目前就想著這樣子做,因為後麵可能在這個站點上實驗些其他的東西,有可能會用到 docker,選擇了用 nginx
來處理請求。
ssl證書
sll證書用的阿裏雲的 雲盾證書, 因為自己服務器就在阿裏雲,當然最大的原因還是免費。操作還是簡單的,進去一通亂點找到免費的那個購買就行了。
服務器(centos)下載 nginx
-
編譯環境,已經安裝的可以忽視
// 安裝make: yum -y install gcc automake autoconf libtool make // 安裝g++ yum install gcc gcc-c++
-
選擇安裝目錄,我選擇安裝在
/usr/local/src
下cd /usr/local/src
-
安裝
pcre
,zlib
, 前者為了重寫rewrite,後者為了gzip壓縮。注意下麵wget的地址,可能你下載時候這個版本會沒有資源,你可以直接訪問那個地址進去看看最新的資源版本號是多少,個人意見如果你和我一樣之前的版本都沒有用過的話,有最新穩定版的就用最新的,這個後麵會提到。
// 安裝 pcre cd /usr/local/src wget ftp://ftp.csx.cam.ac.uk/pub/software/programming/pcre/pcre-8.40.tar.gz tar -zxvf pcre-8.40.tar.gz cd pcre-8.40 ./configure make make install // 安裝 zlib wget https://zlib.net/zlib-1.2.11.tar.gz tar -zxvf zlib-1.2.11.tar.gz cd zlib-1.2.11 ./configure make make install
-
安裝
ssl
wget https://www.openssl.org/source/openssl-1.0.1t.tar.gz tar -zxvf openssl-1.0.1t.tar.gz ./config make make install
-
安裝
nginx
wget https://nginx.org/download/nginx-1.13.0.tar.gz tar -zxvf nginx-1.13.0.tar.gz cd nginx-1.13.0 //下麵是把 Nginx 安裝到 /usr/local/nginx 目錄下,注意後麵跟的是剛才安裝的pcre、zlib和ssl的源碼地址,根據自己安裝的調整 ./configure --sbin-path=/usr/local/nginx/nginx \ --conf-path=/usr/local/nginx/nginx.conf \ --pid-path=/usr/local/nginx/nginx.pid \ --with-http_ssl_module \ --with-pcre=/usr/local/src/pcre-8.40 \ --with-zlib=/usr/local/src/zlib-1.2.11 \ --with-openssl=/usr/local/src/openssl-1.0.1t make make install
-
啟動
確保80端口沒有被占用,我之前node是在監聽80端口的,現在把服務先停止。
//查看端口情況 netstat -ano|grep 80 //啟動nginx sudo /usr/local/nginx/nginx
啟動後再重新打開你的站點,看到
Welcome to nginx!
界麵就安裝好了。配置ssl證書
一般網上申請好證書,下載時候都會給你些配置提示,我這個阿裏雲的證書,下載時候就根據不同配置給了詳細的答案。把證書下載下來,放到nginx文件中,我這裏放在了一個新建的
cert
文件夾中,然後配置nginx文件下的nginx.conf
開啟https
.
// 配置前先備份總沒有錯
cp nginx.conf nginx.conf.back
// 進入配置文件後找到下麵https的配置,有個 `# HTTPS server`的注釋
server {
listen 443;
server_name 你的證書站點;
ssl on;
root html;
index index.html index.htm;
ssl_certificate cert/你的證書;
ssl_certificate_key cert/你的key;
ssl_session_timeout 5m;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
location / {
root html;
index index.html index.htm;
}
}
配置好之後重啟你的nginx, sudo /usr/local/nginx/nginx -s reload
然後用https
訪問你的站點,如果可以看到歡迎界麵就說明成功了,我這裏被坑了一下,因為服務器默認沒有開啟443端口的權限,我就一直訪問不了,後麵去阿裏的控製台加了443端口權限就可以了。
全站https
說白了就是訪問http
的請求強行轉到https
上,還是配置nginx,把上麵監聽80端口的server重定向到https
server {
listen 80;
server_name xxxx.com www.xxxx.com;
rewrite ^ https://$http_host$request_uri? permanent;
}
設置好後重啟nginx,再去訪問自己站點的http
鏈接,應該可以看到自動跳轉到了https
,這一步應該問題不大,我這裏遇到了一個奇怪的問題,訪問主站點時候居然重定向到了這個網站https://localhost
,還以為配置不對搞了半天不知道哪裏的問題,後麵把我的chrome
的緩存啥的清理一遍居然自己好了。
反向代理到真正的服務
這裏主要就是把https的請求即監聽433端口的那個server
,代理到真正的處理後台上。我這裏把nodejs
監聽的端口挑到了8080,還是配置nginx,修改上麵433端口server配置裏麵location /
裏麵到內容。
location / {
# 代理用戶真實信息
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-NginX-Proxy true;
# 要代理的本地後台 我的是8080端口
proxy_pass https://127.0.0.1:8080;
# 這裏是因為我站點有websocket服務,nginx (>= 1.3.13) 版本可以代理,所以說用盡量新的版本比較ok.
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
設置好之後重啟nginx,如果正常的話配置就差不多可以了。
第三方服務和一些問題
因為我的網站還沒做多久,所以曆史問題還不嚴重,大概看一看就知道那些第三方鏈接不對,現在基本上服務商都提供https
的資源了,把不合格的資源換成https
試一試,可以請求的話就去改代碼吧,這裏遇到兩個問題。
七牛雲 的圖片資源,改
https
後請求不了。去七牛雲搞了半天上傳了自己的證書什麼的,還是不知道在哪裏配置。索性自己網站用的圖片還少,憤怒的打算用自己站點之前做的文件上傳服務了,後麵想想我自己1M的網速,還是忍住了。後麵發現阿裏雲的 oss,可以用https請求,就把圖片資源換成阿裏雲的了。自己的
websocket
服務用的nodejs的socket.io
庫,還用到了根據用戶ip定位的功能,轉發後原來代碼裏獲取到的ip地址全變成了127.0.0.1
,還以為配置不對改了半天,後麵打印出庫說明文件裏獲取ip信息的client.handshake
對象。發現用戶ip是headers
的x-real-ip
屬性,所以改代碼根據這個屬性獲取ip,然後可以正常獲取ip信息了。
到這裏全站https基本都配置好了,因為自己網站比較新,全站轉過來還挺輕鬆了,可以想象如果維護很久了都站點去轉肯定要遇見n多的問題。所以大家有這個想法的就早點動手吧。
參考資料
最後更新:2017-09-04 00:03:07