7.1 Cookies
在 practice
資料夾下,建立 cookie.html
,以便練習。
並用網域(例:http://127.0.0.1:5500/practice/cookie.html
)的方式來開啟。
什麼是 Cookie?
Cookie 是網站在您瀏覽網頁時儲存在您的電腦上的資料。
Cookie 可用於儲存各種資訊,包含個人識別資訊(例如姓名、id……等等)。
容量空間有限,大約 4K 左右。
可以設定 cookie 的存活期間,如果沒有設定,預設就是當下使用者瀏覽網頁的期間(session),結束瀏覽器的話就自動消失。
在哪裡可看到 cookie 資訊?
開啟開發者工具,在 Application 頁籤當中。
Cookie 的操作
建立 Cookie 與更新
以下程式建立了兩個 cookie,名稱(Name)叫做「food_id」,值(Value)是「abc」;另一個是名稱叫做「ad_code」,值是「year2020」:(執行完以下程式後,找出在哪裡看得到。)
更新的語法同上,如果 food_id 本身是已經存在的話,那就會是更新。
取得 Cookie
會是一整個字串。如果想取得單一的資訊呢? 其實滿麻煩。參考後續的函式提供。
設定 Cookie 存活期間
以下原始碼,設定 ad_code 這個 cookie 的存活期間是到「Thu, 18 Dec 2999 03:00:00 UTC
」
刪除 Cookie
只要將 cookie 的存活期間設定成過去的時間,就會刪除,例:
Cookie 有用函式
https://www.w3schools.com/js/js_cookies.asp 官方提供了 setCookie 及 getCookie 函式,讓我們方便設定 cookie 及 取得 cookie,第三個 checkCookie 是老師改寫,判斷某 cookie 是否存在,回傳 true 或 false。
在 practice/js/
資料夾下,建立 all_func.js
檔案,將以上原始碼放進去。然後頁面要載入 all_func.js
檔案。
然後練習執行以下程式:
Last updated