一、定義
//
是缺省協議,默認使用當前頁面的協議。
如果當前頁面使用的是 http 協議,則//
自動識別並替換爲http://
,如果使用的是 https 協議,則//
自動識別並替換爲https://
。
例如:www.guowang.com
- 當前頁面爲
http
協議時,則等效於http://www.guowang.com - 當前頁面爲
https
協議時,則等效於https://www.guowang.com
二、優缺點
優點:
- 自適應
http
和https
協議,能根據用戶打開頁面的方式自動識別請求協議; - 當前頁面和目標資源同時支持
http
和https
,並支持正在從http
升級到https
; - 對於
https
頁面的內容,瀏覽器默認會組織非https
內容(http協議在https協議的頁面裏會報錯),使用//
可以避免這種情況。
缺點:
- 直接打開本地文件調試時,使用的協議是文件協議
file://
。
通過缺省協議的優缺點,我們可以在開發階段使用固定的協議來調試代碼,當要部署準生產或者生產環境時,將固定協議修改爲缺省協議。
三、應用場景
- 當網站從
http
協議升級爲https
協議時,使用//
可以避免修改前端代碼中的所有鏈接地址,如a標籤的href,img標籤的src; - 開發時,寫成 “//網址/文件” 來替代前面的協議,例如://www.guowang.com/web,具體是ssl協議還是普通的http協議,交給瀏覽器去自動識別並與當前站點匹配,從而實現最佳的安全請求和最高效的加載方法。
四、使用細節
當一個前端人被藐視的時候:用 // 代替 http:// 有什麼好處?
1、如果你用 http:// ,那你就是默認當前頁面是 http 協議了,你一個前端憑什麼決定當前頁面的協議,難道你不知道 http 鏈接在 https 頁面裏會報錯啊?
2、你應該沿用當前頁面的協議,所以你要寫 //如果你用 https://,也是一樣的問題,你怎麼知道三年後會不會出現一個 httpshe://,難道到時候你再全部改成 httpshe:// ?
3、不要做任何明顯是錯誤的假設!你根本就不知道當前頁面會用什麼協議打開!所以你要用 // 啊!
五、HTTP與HTTPS比較
HTTP
- http默認端口:80;
- http走明文通道,信息是明文傳輸;
- http是最爲廣泛的一種網絡協議,是一個客戶端和服務器端請求和應答的標準(TCP),用於從WWW服務器傳輸超文本到本地瀏覽器的傳輸協議;
- http可以使瀏覽器更加高效,使網絡傳輸減少。
HTTPS
- https默認端口:443;
- https走加密通道,具有安全性的ssl加密傳輸協議,要申請 CA證書,收費的多,免費的少;
- https是http的安全版,即http下加入ssl層,https的安全基礎是ssl,加密的詳細內容就需要ssl,https更安全。
HTTPS的作用:
- 建立一個信息安全通道,來保證數據傳輸的安全;
- 確認網站的真實性。