假設有這麼個場景前端
某天,你接到一個任務,須要開發一個做品投票的網站,可讓別人訪問連接進入活動頁面,天天給心儀的做品投幾票。數據庫
這看起來好像很簡單,可是有個問題,整個流程裏沒有登陸系統,也就是說無法區分用戶。npm
那還怎麼存儲用戶數據?瀏覽器
localStorage
嗯哼,這好像只能這樣了吧。可這安全性也太差了,分分鐘被人刷票。安全
那就來點複雜的 —— 心理戰術。網站
沒有登陸系統,稍懂點前端的就會猜出用戶數據存在本地上,由於前端有權限問題,沒法獲取到IP或者MAC地址之類的惟一標識,那隻能存瀏覽器本地。加密
因此咱們須要在localStorage存儲數據,只寫不讀,這是一個煙霧彈,用來迷惑別人。code
固然,這還不夠,太直白了,須要加密處理。內存
不只如此,咱們還要發送請求,並讓後臺返回數據,一樣加密處理,這也是一個煙霧彈,目的是過濾掉半吊子,減少風險。開發
而真實的數據咱們要存儲在不經常使用的地方,好比IndexedDB
。
IndexedDB是瀏覽器裏的數據庫,由於其使用麻煩,加之兼容性問題,因此不多被使用。
綜合考慮,因此咱們採用localforage
,這是一個npm包,有興趣能夠了解一下。
localforage優先使用IndexedDB存儲,即便咱們將數據藏在這,一旦被人破掉前面兩關,查看其它本地存儲就會暴露。
那麼試着最後的欺騙,給數據加密,key和value都是由空格組成的數據,即便數據在變更,也難以感知。
固然這樣還不夠騷,再來個臨時變量,把數據存在內存中,優先使用內存中的數據,沒有數據再從localforage裏取。
以上即是整個策略,
①xhr虛假請求
②localStorage迷惑
③偏門存儲
④空白數據
⑤內存防禦
明明就是個簡單的功能,卻搞這麼複雜。沒辦法啊,前段時間我正好碰上了。