JavaScript 中的 Cookie：指南

        JavaScript 中的 cookie 是什么？

        让我们举个例子：如果我们有一个网页或网站，我们想在其中存储用户信息（注册或登录详细信息），以便当用户返回同一页面时，服务器知道该用户并将用户信息呈现在需要的页面。因此，cookie 将用户信息存储在其中。

        创建 Cookie：

        在 JavaScript 中，创建 cookie 是一个非常简单的过程。我们编写以下行来创建一个包含用户信息的 cookie。例如，我们要存储当前登录用户的用户名。

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">文档。cookie = “用户名 = 大卫华纳；”</span></span></span>

        上面的行创建了一个名称为用户名的 cookie，但我们还应该提及到期日期，即应该删除 cookie 的时间，如果我们不提及到期日期，则在关闭浏览器时删除 cookie。例如，我们希望在用户注销时删除当前登录用户的 cookie。

        我们可以在创建 cookie 时提及到期日期，如下所示：

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">文档。cookie = “用户名 = 大卫华纳；过期 = 2022 年 11 月 17 日星期四 23:00:00 UTC；”</span></span></span>

        或者可以在浏览器关闭时将其删除。

        创建cookie时还有一个属性需要设置，即path：

  path=path（例如，' /'、' /mydir'）如果未指定，则默认为当前文档位置的当前路径。

       我提到了 path = “/” 因为我想访问我网站上任何地方的 cookie。

        删除 Cookie：

        上面，我们已经创建了一年的cookie。现在，如果我们想在用户注销时删除 cookie，在注销按钮的单击事件侦听器或您用于注销的任何 HTML 元素下，我们将编写以下代码：

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">document.cookie = "username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/";</span></span></span>

        在上面的代码中，cookie 的名称即用户名被清空，到期日期设置为过去的日期，cookie 被删除。

        获取饼干：

        要获取当前 cookie，我们只需编写： document.write

       下面是我用于在我的一个项目中创建、获取和删除 cookie 的代码：

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">function createCookie(userKey,r_token){ 
    let separator = ";" ; 
    document.cookie = "user_key=" + userKey + ";expires = 2022 年 11 月 17 日星期四 23:00:00 UTC;path=/"; 
    document.cookie = "renew_token = " + r_token + ";expires = 2022 年 11 月 17 日星期四 23:00:00 UTC;path=/" 

}</span></span></span>

        在上面的代码中，我想在 cookie 中存储两个值，因此我可以使用上述方法分别创建两个具有两个不同值的 cookie，或者我们也可以编写以下代码：

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">function createCookie(userKey,r_token){ 
    let separator = ";" ; 
    让值 = [userKey,r_token].join(separator); 
    document.cookie = "myValues="+values+";expires = 2022 年 11 月 17 日星期四 23:00:00 UTC;" 
}</span></span></span>

        注销时删除cookie：

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">document.getElementById("logoutBtn").addEventListener("click",function(){ 
    document.cookie = "user_key= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/"; 
    document.cookie = "renew_token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/" 

})</span></span></span>

        我希望这篇文章有助于理解 cookie 的概念。

七爪网7claw.com