首頁 > 開發者 > JavaScript

JavaScript中Cookies的相關使用教程

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

JavaScript中Cookies的相關使用教程

 　　這篇文章主要介紹了JavaScript中Cookies的相關使用教程,包括Cookies的儲存和刪除等操作方法,需要的朋友可以參考下

　　Cookies是什麼 ?

　　Web瀏覽器和伺服器使用HTTP協議進行通訊，並且HTTP是一種無狀態協議。但對於一個商業網站它需要保持不同的頁面間的會話資訊。例如在完成多頁後，一個使用者註冊結束。但是，如何保持所有網頁使用者的會話資訊。

　　在許多情況下，使用Cookie來記憶和跟蹤的喜好，採購，傭金，並要求更好的訪問體驗或網站的統計資料等資訊的最有效方法。

　　它是如何工作的 ?

　　伺服器發送一些資料到訪問者的瀏覽器以cookie的形式。該瀏覽器可以接受cookie。如果是這樣，它是為訪問者儲存在硬碟上的一個純文字的記錄。現在，當訪問者到達您的網站其他頁面，瀏覽器發送相同cookie到伺服器進行檢索。一旦檢索到，伺服器知道/記得剛才發生了什麼儲存。

　　Cookies有5個可變長度欄位的純文字資料記錄：

　　Expires : cookie將到期的日期。如果這是空白的，那麼就是當訪問者退出瀏覽器cookie將到期。

　　Domain : 網站的網域名稱。

　　Path : 路徑設定 cookie 目錄或網頁。如果想要從任何目錄或頁面，那麼cookie 是空的。

　　Secure : 如果該欄位包含“安全”二字，那麼cookie僅可檢索到一個安全的伺服器。如果該欄位為空白，沒有限制存在。

　　Name=Value : Cookie設定在鍵和值對的形式來擷取。

　　的Cookie最初設計用於CGI編程和cookies的資料是在Web瀏覽器和Web伺服器之間自動傳輸的，所以在伺服器上的CGI指令碼可以讀取和寫入儲存在用戶端上的cookie的值。

　　JavaScript的也可以操作使用文檔對象的cookie屬性。 JavaScript可以讀取，建立，修改和刪除適用於當前網頁的cookie或Cookies。

　　儲存Cookies:

　　建立一個cookie的最簡單的方法是一個字串值分配到document.cookie對象，它是這樣的：

　　文法

　　document.cookie = "key1=value1;key2=value2;expires=date";

　　在這裡，expires屬性選項。如果提供這個屬性有一個有效日期或時間，那麼cookie將在給定的日期或時間滿期，而後cookies的值將無法訪問到。

　　注意：Cookie的值可能不包括分號，逗號或空白。出於這個原因，可能需要使用JavaScript 的 escape()函數將其儲存的值在cookie之前進行編碼。如果這樣做，當讀取cookie的值時也必須使用相應的unescape()函數。

　　讀取Cookies:

　　讀取cookie和寫入一樣簡單，因為 document.cookieobject 的值是cookie。所以每當要訪問cookie，可以使用這個字串。

　　該字串 document.cookie將繼續由分號，其中name是一個cookie的名稱，值是它的字串值分隔的名稱=值對的列表。

　　設定Cookies的到期日期：

　　可以通過設定的到期日和儲存cookie中的失效日期延長超出當前瀏覽器會話cookie中的壽命。這可以通過設定expires屬性的日期和時間來完成。

　　例子：

　　下面的例子示範了如何設定cookie1個月後到期：

　　?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<html>

<head>

<script type="text/javascript">

<!--

function WriteCookie()

{

var now = new Date();

now.setMonth( now.getMonth() + 1 );

cookievalue = escape(document.myform.customer.value) + ";"

document.cookie="name=" + cookievalue;

document.cookie = "expires=" + now.toUTCString() + ";"

alert("Setting Cookies : " + "name=" + cookievalue );

}

//-->

</script>

</head>

<body>

<form name="formname" action="">

Enter name: <input type="text" name="customer"/>

<input type="button" value="Set Cookie" onclick="WriteCookie()"/>

</form>

</body>

</html>

　　刪除Cookie：

　　有時如果想刪除一個cookie，以便後續嘗試讀取cookie返回什麼。要做到這一點，你只需要在到期日設定在過去的某個時間。

　　例子：

　　下面的例子示範了如何通過設定有效期間限一個月以前刪除cookie：

　　?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<html>

<head>

<script type="text/javascript">

<!--

function WriteCookie()

{

var now = new Date();

now.setMonth( now.getMonth() - 1 );

cookievalue = escape(document.myform.customer.value) + ";"

document.cookie="name=" + cookievalue;

document.cookie = "expires=" + now.toUTCString() + ";"

alert("Setting Cookies : " + "name=" + cookievalue );

}

//-->

</script>

</head>

<body>

<form name="formname" action="">

Enter name: <input type="text" name="customer"/>

<input type="button" value="Set Cookie" onclick="WriteCookie()"/>

</form>

</body>

</html>

　　註：不設定日期，可以使用setTime()函數看到新值。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More