国产99久久精品_欧美日本韩国一区二区_激情小说综合网_欧美一级二级视频_午夜av电影_日本久久精品视频

最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
當前位置: 首頁 - 科技 - 知識百科 - 正文

JavaScript學習教程之cookie與webstorage

來源:懂視網 責編:小采 時間:2020-11-27 21:54:36
文檔

JavaScript學習教程之cookie與webstorage

JavaScript學習教程之cookie與webstorage:cookie 由于http是無狀態的協議,一旦客戶端和服務器的數據交換完畢,就會斷開連接,再次請求,會重新連接,服務器單從網絡連接上是沒有辦法知道用戶身份的。cookie就是為了解決此問題而產生的,每次新的用戶請求時,便給用戶頒發一個獨一無二的身份證,下次
推薦度:
導讀JavaScript學習教程之cookie與webstorage:cookie 由于http是無狀態的協議,一旦客戶端和服務器的數據交換完畢,就會斷開連接,再次請求,會重新連接,服務器單從網絡連接上是沒有辦法知道用戶身份的。cookie就是為了解決此問題而產生的,每次新的用戶請求時,便給用戶頒發一個獨一無二的身份證,下次

cookie

由于http是無狀態的協議,一旦客戶端和服務器的數據交換完畢,就會斷開連接,再次請求,會重新連接,服務器單從網絡連接上是沒有辦法知道用戶身份的。cookie就是為了解決此問題而產生的,每次新的用戶請求時,便給用戶頒發一個獨一無二的身份證,下次訪問,必須帶上身份證,這樣服務器就會知道是哪個用戶進行了訪問,針對不同用戶,做出不同的響應cookie是一個很小的純文本文件(最多為4K),是瀏覽器儲存在用戶的機器上的。儲存一些服務器需要的信息,每次請求站點,會發送相應的cookie,這些cookie可以用來辨別用戶身份信息等作用。

cookie的屬性字段

props intro
name cookie的名稱
value cookie的值
domain 可以訪問cookie的域名
path 可以訪問此cookie的頁面路徑
expires/Max-Age cookie有效的時間
Size cookie的大小
httpOnly js能否讀取到cookie信息
secure 是否只能通過https來傳遞此條cookie

cookie是以純文本的方式存儲,即cookie的數據類型為String類型

document.cookie = 'name=userInfo'; // 設置cookie的name屬性
document.cookie = 'username=Jack'; // 在cookie中存儲了username信息
console.log(document.cookie); // name=userInfo; username=Jack
document.cookie = 'name=userInfo'; // 設置cookie的name屬性
document.cookie = 'username=Amy'; // 在cookie中存儲了username信息
console.log(document.cookie); // name=userInfo; username=Amy

通過上面的實例可以知道,給cookie賦值時是不會覆蓋cookie的原有的值,當等號前的屬性名相同時,才會將原來相同屬性名的值覆蓋為后來設置的值。注意,cookie的兩個字段之間是通過一個分號和空格分隔,而不是只有一個分號

當要給cookie設置非自定義的屬性字段時,需要通過字符串追加的方式

例如

let expireDate = new Date();
document.cookie += ";expires=" + expireDate.toString();

注意: ";expires="中的分號必須有,如果字段前不加分號則會認為這是一個自定義字段

domain

非頂級域名,如二級域名或者三級域名,設置的cookie的domain只能為頂級域名或者二級域名或者三級域名本身,不能設置其他二級域名的cookie,否則cookie無法生成。

頂級域名只能設置domain為頂級域名,不能設置為二級域名或者三級域名,否則cookie無法生成。

二級域名能讀取設置了domain為頂級域名或者自身的cookie,不能讀取其他二級域名domain的cookie。所以要想cookie在多個二級域名中共享,需要設置domain為頂級域名,這樣就可以在所有二級域名里面或者到這個cookie的值了。

頂級域名只能獲取到domain設置為頂級域名的cookie,其他domain設置為二級域名的無法獲取。

總的來說就是,上級域名不能訪問下級域名的cookie,下級域名可以讀取自身及上級域名的cookie,同級域名的cookie不共享,即同級域名之間不能互相訪問對方的cookie,只能訪問自身的cookie。

path

path字段為可以訪問此cookie的頁面路徑。 比如domain是abc.com,path是/test,那么只有/test路徑下的頁面可以讀取此cookie。

expires/Max-Age

expires/Max-Age 字段為此cookie超時時間。若設置其值為一個時間,那么當到達此時間后,此cookie失效。不設置此字段時,默認值是Session,即當瀏覽器關閉(注意:不是瀏覽器標簽頁,而是整個瀏覽器) 后,此cookie失效。

let expireDate = new Date("2019-5-26T09:00:00");
document.cookie += ";expires=" + expireDate.toString();

若要刪除某條cookie則設置此條cookie的expires為當前時間之前的時間的即可

let expireDate = new Date("1970-01-01T00:00:00");
document.cookie += ";expires=" + expireDate.toString();

size

Size字段 此cookie大小。

httpOnly

若此屬性為true,則只有在http請求頭中會帶有此cookie的信息,而不能通過document.cookie來訪問此cookie,設置為true可以減少受到Xss攻擊的風險

secure

secure 字段 設置是否只能通過https來傳遞此條cookie

localstorage/sessionstorage

webstorage并不是要替代cookie,而是為了彌補隨著web的發展,cookie在存儲限制(存儲容量最多為4k),安全性(在http協議中明文傳輸)存在的缺點而提出的

兩者的API是相同的

function intro
setItem(key, value) 以鍵值對的形式保存一條數據
getItem(key) 根據鍵來獲得值
removeItem(key) 根據鍵來刪除一條數據
key(index) 根據索引獲得鍵的名稱
clear() 刪除全部數據

兩者都有length屬性

sessionStorage.setItem("name", "Jack");
sessionStorage.setItem("phone", "18856894523");
console.log(sessionStorage.getItem('name')); // Jack
console.log(sessionStorage.key(0)); // name
console.log(sessionStorage.length); // 2
sessionStorage.removeItem('phone');
console.log(sessionStorage.length); // 1
sessionStorage.clear(); 
console.log(sessionStorage.length); // 0

兩者的比較

  • localStorage和sessionStorage都是用來存儲客戶端臨時信息的對象。均只能存儲字符串類型的對象,雖然規范中可以存儲其他原生類型的對象,但是目前為止沒有瀏覽器對其進行實現。
  • localStorage生命周期是永久,除非用戶顯示在瀏覽器提供的UI上清除localStorage信息,否則這些信息將永遠存在。
  • sessionStorage生命周期為當前窗口或標簽頁,一旦窗口或標簽頁被永久關閉了,sessionStorage存儲的數據就被清空了。
  • 不同瀏覽器無法共享localStorage或sessionStorage中的信息。
  • 相同瀏覽器的不同頁面(頁面屬于相同域名和端口)間可以共享相同的localStorage
  • 不同頁面或標簽頁間無法共享sessionStorage的信息。注意,頁面及標簽頁僅指頂級窗口,如果一個標簽頁包含多個iframe標簽且屬于同源頁面,那么他們之間是可以共享sessionStorage的。
  • 使用window.open打開頁面和改變localtion.href方式都可以獲取到sessionStorage內部的數據
  • cookie 與 webstorage的區別

    存儲限制

  • 每個domain中只能存儲最多20條cookie,cookie數據不能超過4K
  • webStorage也有存儲大小的限制,但是比cookie大得多,可以達到5M或更大
  • 數據的有效期

  • sessionStorage:僅在當前的瀏覽器窗口關閉有效;
  • localStorage:始終有效,除非用戶手動刪除
  • cookie:cookie過期時間之前一直有效,即使窗口和瀏覽器關閉
  • 作用域

  • sessionStorage:不在不同的瀏覽器窗口中共享,即使是同一個頁面;
  • localStorage:同源窗口共享
  • cookie:同源窗口共享
  • 總結

    聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

    文檔

    JavaScript學習教程之cookie與webstorage

    JavaScript學習教程之cookie與webstorage:cookie 由于http是無狀態的協議,一旦客戶端和服務器的數據交換完畢,就會斷開連接,再次請求,會重新連接,服務器單從網絡連接上是沒有辦法知道用戶身份的。cookie就是為了解決此問題而產生的,每次新的用戶請求時,便給用戶頒發一個獨一無二的身份證,下次
    推薦度:
    標簽: 學習 cookie storage
    • 熱門焦點

    最新推薦

    猜你喜歡

    熱門推薦

    專題
    Top
    主站蜘蛛池模板: 91中文字幕在线 | 日韩精品一二三区 | 国产亚洲一区二区三区不卡 | 精品国产成人综合久久小说 | 最新大黄网站免费 | 日韩在线观看不卡 | 日日做夜夜爱 | 九九久久国产 | 手机看片91精品一区 | 国产综合在线视频 | 欧美精品专区免费观看 | 亚洲va欧美 | 国产成人精品久久一区二区三区 | 日韩亚洲欧洲在线com91tv | 国产特级全黄一级毛片不卡 | 欧美日韩免费看 | 欧美极品尤物在线播放一级 | 国产欧美综合精品一区二区 | 精品国产欧美一区二区三区成人 | 韩国在线视频 | 欧美综合一区 | 91原创国产| 在线观看欧美日韩 | 国产高清精品久久久久久久 | 日本五十路视频 | 亚洲综合图片小说区热久久 | 真实的国产乱xxxx在线 | 中文字幕 在线观看 | 国产小视频在线免费观看 | 国产精品网址 | 精品久久久久中文字幕日本 | 日韩欧美片 | 伊人色综合97 | 99视频九九精品视频在线观看 | 自拍网在线 | 在线观看黄a大片爽爽影院免费 | 91国内精品久久久久免费影院 | 91.久久 | 波多野结衣系列在线观看 | 欧美第5页| 欧美视频日韩视频 |