JavaScript 設定Cookie過期時間無效

到達過期時間之後，Cookie會被自動刪除，這也是Cookie刪除操作的實現原理。

有時雖然設定了過期時間（沒有任何語法錯誤），但是到達過期時間之後，cookie並未被刪除。

下面介紹一種非常具有迷惑性Cookie過期時間無效的情況，供大家參考。

一.現象描述：

通過谷歌瀏覽器控制檯在螞蟻部落寫入如下Cookie：

[JavaScript] 純文字檢視 複製程式碼
document.cookie = 'softwhy="螞蟻部落";expires='+new Date()+';path=/'

控制檯執行效果截圖如下：

程式碼分析如下：

（1）.document.cookie屬性新增一個Cookie，name是softwhy，value是字串"螞蟻部落"。

（2）.new Date()獲取的是客戶端本地當前日期時間，也就是說Cookie會立馬過期。

但實際情況是，此Cookie並沒有被立馬刪除，依然可以通過document.cookie屬性獲取：

上述程式碼是在谷歌瀏覽器的表現，但是在火狐瀏覽器表現是正常的。

二.原因分析：

下面通過谷歌開發者工具檢視一下上述Cookie的過期時間：

時間分析如下：

（1）.對比這個Cookie實際過期時間與控制檯返回的時間。

（2）.發現北京時間被谷歌瀏覽器粗暴修改為GMT/UTC時間，沒有進行換算。

（3）.在前端可以認為GMT與UTC時間完全是一回事，都是指世界標準時間。

（4）.由於北京時區是東八區，所以UTC/GMT+8=北京時間。

（5）.所以上面Cookie真正過期時間並不是北京時間2019年11月13日22:04:15，而是再延後8小時。

（6）.火狐瀏覽器進行了正確處理，並不會粗暴處理北京時間，而是將北京時間轉換為GMT/UTC時間。

三.正確設定過期時間：

下面給出正確設定過期時間的方式，程式碼如下：

[JavaScript] 純文字檢視 複製程式碼
document.cookie = 'softwhy="螞蟻部落";expires='+new Date().toUTCString()+';path=/'

通過方法將其轉換為GMT/UTC時間，然後再去設定過期時間。

關於Cookie過期更多內容可以參閱如下幾篇文章：

（1）.JavaScript 刪除Cookie一章節。

（2）.Cookie max-age與expires 區別一章節。

（3）.max-age設定Cookie過期時間一章節。