JavaScript 设置 Cookie 并使用 PHP 获取的教程

心靈之曲
发布: 2025-10-21 12:43:01
原创
858人浏览过

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 只对当前页面有效。通常设置为 /,表示对整个网站有效。

示例:

立即学习PHP免费学习笔记(深入)”;

豆包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;
?>
登录后复制

示例:

立即学习PHP免费学习笔记(深入)”;

<?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。

示例:

立即学习PHP免费学习笔记(深入)”;

// 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中文网其它相关文章!

PHP速学教程(入门到精通)
PHP速学教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号