javascript 设置 cookie 并使用 php 获取的教程

本文介绍了如何使用 JavaScript 在客户端设置 Cookie,并通过 PHP 在服务器端获取 Cookie 的值。重点讲解了 Cookie 的设置方式,以及在 PHP 中如何访问和使用 Cookie。同时,也指出了 Cookie 的生命周期和适用场景,并提供了使用 AJAX 传递 Cookie 的替代方案。

使用 JavaScript 设置 Cookie

在 Web 开发中,Cookie 是一种常用的在客户端存储少量数据的机制。JavaScript 提供了 document.cookie 属性来设置和读取 Cookie。

基本语法:

document.cookie = "cookieName=cookieValue; expires=date; path=/";
登录后复制
  • cookieName: Cookie 的名称。
  • cookieValue: Cookie 的值。
  • expires: Cookie 的过期时间,格式为 Day, DD Mon YYYY HH:MM:SS GMT。如果省略,Cookie 会在浏览器关闭时失效。
  • path: Cookie 的有效路径。如果省略,Cookie 只对当前页面有效。通常设置为 /,表示对整个网站有效。

示例:

立即进入豆包AI人工智官网入口”;

立即学习豆包AI人工智能在线问答入口”;


豆包AI编程

豆包AI编程

豆包推出的AI编程助手

豆包AI编程483


查看详情
豆包AI编程

// 设置一个名为 'username' 的 Cookie,值为 'JohnDoe',有效期为 7 天
let now = new Date();
let time = now.getTime();
let expireTime = time + 7*24*60*60*1000;
now.setTime(expireTime);

document.cookie = "username=JohnDoe;expires=" + now.toUTCString() + ";path=/";

// 设置一个名为 'testing' 的 Cookie,其值来自耗时操作
async function setCookie() {
  // 模拟一个耗时操作,例如从第三方 API 获取数据
  const data = await new Promise(resolve => setTimeout(() => resolve("Data from API"), 5000));
  document.cookie = "testing=" + data + ";path=/";
  console.log("Cookie 'testing' set with value:", data);
}

setCookie();
登录后复制

注意事项:

  • Cookie 的值需要进行 URL 编码,以避免特殊字符引起的问题。可以使用 encodeURIComponent() 函数进行编码。
  • Cookie 的大小有限制,通常为 4KB。

使用 PHP 获取 Cookie

PHP 提供了一个超全局变量 $_COOKIE 来访问客户端设置的 Cookie。

基本语法:

<?php
  $cookieValue = $_COOKIE["cookieName"];
  echo $cookieValue;
?>
登录后复制

示例:

立即进入豆包AI人工智官网入口”;

立即学习豆包AI人工智能在线问答入口”;

<?php
  if(isset($_COOKIE["username"])) {
    $username = $_COOKIE["username"];
    echo "Welcome, " . htmlspecialchars($username) . "!";
  } else {
    echo "Welcome, guest!";
  }

  if(isset($_COOKIE["testing"])) {
    $testingValue = $_COOKIE["testing"];
    echo "<br>Testing Cookie Value: " . htmlspecialchars($testingValue);
  } else {
    echo "<br>Testing Cookie not set.";
  }
?>
登录后复制

注意事项:

  • 在访问 Cookie 之前,应该使用 isset() 函数检查 Cookie 是否存在,以避免出现错误。
  • 为了安全起见,应该对 Cookie 的值进行适当的过滤和转义,以防止 XSS 攻击。可以使用 htmlspecialchars() 函数进行转义。

Cookie 的生命周期和适用场景

Cookie 的生命周期由 expires 属性决定。如果省略 expires 属性,Cookie 会在浏览器关闭时失效,称为会话 Cookie。如果设置了 expires 属性,Cookie 会在指定的过期时间后失效,称为持久 Cookie。

Cookie 适用于存储少量、非敏感的用户数据,例如:

  • 用户偏好设置
  • 登录状态
  • 购物车信息

使用 AJAX 传递 Cookie

由于 Cookie 在设置后需要重新加载页面才能在 PHP 中访问,如果不想重新加载页面,可以使用 AJAX 将 Cookie 的值传递给 PHP。

示例:

立即进入豆包AI人工智官网入口”;

立即学习豆包AI人工智能在线问答入口”;

// JavaScript (假设已设置 Cookie 'testing')
async function sendCookieToPHP() {
  const testingValue = document.cookie.replace(/(?:(?:^|.*;/s*)testing/s*/=/s*([^;]*).*$)|^.*$/, "$1");

  const response = await fetch('process_cookie.php', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded',
    },
    body: `testing=${encodeURIComponent(testingValue)}`
  });

  const result = await response.text();
  console.log(result); // 显示 PHP 的响应
}

sendCookieToPHP();
登录后复制
<?php
// PHP (process_cookie.php)
if (isset($_POST['testing'])) {
  $testingValue = $_POST['testing'];
  echo "Received testing value via AJAX: " . htmlspecialchars($testingValue);
} else {
  echo "Testing value not received via AJAX.";
}
?>
登录后复制

总结:

本文介绍了如何使用 JavaScript 设置 Cookie,并通过 PHP 获取 Cookie 的值。通过理解 Cookie 的设置方式、生命周期和适用场景,可以更好地利用 Cookie 来实现 Web 应用的功能。同时,也介绍了使用 AJAX 传递 Cookie 的替代方案,以满足不同的需求。记住要对 Cookie 的值进行适当的过滤和转义,以确保 Web 应用的安全性。

以上就是JavaScript 设置 Cookie 并使用 PHP 获取的教程的详细内容,更多请关注php中文网其它相关文章!

https://www.php.cn/faq/1636394.html

最后修改日期: 2025-10-21

留言

撰写回覆或留言

发布留言必须填写的电子邮件地址不会公开。