使用 Cookie 编写一个可以展示用户上次浏览商品记录信息的程序。
时间: 2024-11-06 14:16:27 浏览: 10
在编写一个简单的网页应用程序,利用Cookie来存储和显示用户上次浏览的商品记录时,你可以按照以下步骤进行:
1. **获取用户的浏览记录**:
当用户浏览商品时,服务器端可以通过JavaScript将商品ID或其他相关信息作为键值对存储到`sessionStorage`或`localStorage`,因为它们通常比`cookies`更适合保存大量数据。然后设置一个名为`last_viewed_product`的cookie,包含当前商品的ID。
```javascript
// 假设这是商品详情页
function storeLastViewed(product_id) {
// 使用浏览器原生API
if (window.sessionStorage) {
sessionStorage.setItem('last_viewed_product', product_id);
} else {
document.cookie = `last_viewed_product=${product_id}; expires=Thu, 01 Jan 2024 00:00:00 UTC; path=/`;
}
}
```
2. **检查并显示Cookie内容**:
当用户回到首页或者其他页面,可以检查是否有`last_viewed_product` cookie,并在适当的地方展示这个信息。这通常是通过检查cookie并在前端显示用户最近访问过的产品列表。
```javascript
// 主页或公共部分
function displayLastViewedProducts() {
const cookieData = getCookie('last_viewed_product');
if (cookieData) {
const products = decodeURIComponent(cookieData.split(',').map(p => p.trim()).join(', '));
// 这里可以根据产品ID从数据库查询对应的信息,然后渲染到页面上
} else {
// 如果没有cookie,显示默认信息或空列表
}
}
function getCookie(name) {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
let cookie = cookies[i].trim();
if (cookie.indexOf(name + '=') === 0) {
return decodeURIComponent(cookie.substring(name.length + 1));
}
}
return null;
}
```
注意,这只是一个基本示例,实际应用中需要处理更复杂的场景,如Cookie的安全性、有效期管理和跨域问题。
阅读全文