C# javascript 读写Cookie的方法

C# JavaScript 读写 Cookie 的方法

在 Web 开发中，Cookie 是常用的数据存储方式。Cookie 可以在浏览器端或服务器端创建，存储在用户浏览器的 Cookie 文件中，以便下一次访问同一站点时能够获得 Cookie。

本文将详细介绍 C# 和 JavaScript 读写 Cookie 的方法，并提供两个示例说明。

C# 读写 Cookie

C# 读写 Cookie 的主要类是 System.Web.HttpCookie class。下面是一个设置和读取 Cookie 的示例：

//设置 Cookie
HttpCookie cookie = new HttpCookie("name", "value");
cookie.Expires = DateTime.Now.AddYears(1);
Response.Cookies.Add(cookie);

//读取 Cookie
HttpCookie cookie = Request.Cookies["name"];
string value = cookie != null ? cookie.Value : "";

在设置 Cookie 时，使用 HttpCookie 类创建一个新的 Cookie 对象，设置 Cookie 的名称和值，并通过 Response.Cookies 将 Cookie 添加到 HTTP 响应中。Expires 属性设置 Cookie 的过期时间。

在读取 Cookie 时，使用 Request.Cookies 属性获取 HttpCookie 对象。如果 HttpCookie 对象为空，则返回一个空字符串。

JavaScript 读写 Cookie

JavaScript 读写 Cookie 的方法是使用 document.cookie 属性。下面是一个设置和读取 Cookie 的示例：

//设置 Cookie
document.cookie = "name=value; expires=" + new Date(Date.now() + 31536000000).toUTCString() + "; path=/";

//读取 Cookie
function getCookie(name) {
  var cookieArray = document.cookie.split(";");
  for (var i = 0; i < cookieArray.length; i++) {
    var cookie = cookieArray[i].trim();
    if (cookie.indexOf(name) === 0) {
      return cookie.substring(name.length + 1);
    }
  }
  return "";
}
var value = getCookie("name");

在设置 Cookie 时，使用 document.cookie 属性。Cookie 的名称和值是用等号分隔的字符串。expires 属性设置 Cookie 的过期时间。path 属性指定可访问 Cookie 的路径。

在读取 Cookie 时，使用 document.cookie 获取 Cookie 字符串，并使用 getCookie 函数将字符串分割为键值对。如果找到名称匹配的 Cookie，则返回 Cookie 的值。否则，返回空字符串。

示例说明

1. 网站需求：用户登录后，跳转到首页，并设置登录信息的 Cookie，下次打开网站时自动登录。

//登录页面代码
protected void LoginButton_Click(object sender, EventArgs e)
{
  //验证用户信息
  ...

  //设置 Cookie 并跳转到首页
  HttpCookie cookie = new HttpCookie("username", "johndoe");
  Response.Cookies.Add(cookie);
  Response.Redirect("index.aspx");
}

//首页代码
protected void Page_Load(object sender, EventArgs e)
{
  HttpCookie cookie = Request.Cookies["username"];
  if (cookie != null)
  {
    WelcomeLabel.Text = "Welcome back, " + cookie.Value + "!";
  }
}

1. 网站需求：页面展示不同的背景颜色和文本颜色，用户可以通过点击按钮更改颜色，使用 Cookie 记录用户的偏好。

//颜色选择函数
function changeColor(background, text) {
  //设置 Cookie
  document.cookie = "background=" + background + "; path=/";
  document.cookie = "text=" + text + "; path=/";

  //更新页面样式
  document.body.style.backgroundColor = background;
  document.body.style.color = text;
}

//页面初始化
window.onload = function(){
  //读取 Cookie 并更新页面样式
  var background = getCookie("background");
  if (background != "") {
    document.body.style.backgroundColor = background;
  }
  var text = getCookie("text");
  if (text != "") {
    document.body.style.color = text;
  }
}

在此示例中，使用 JavaScript 的 document.cookie 属性来设置和读取 Cookie。当用户点击按钮更改颜色时，将新的颜色值添加到 Cookie 中。每次页面初始化时，读取 Cookie 并更新页面样式。