JavaScript不使用eval()将Cookie中的文章ID字符串转为数组

嘿，你的问题提得很到位！先明确说：完全正确，绝对不能用eval()来处理这种来自Cookie的字符串，后面我会解释原因，再给你几个安全可靠的解决方案。

为什么要避开eval()？ #

Cookie是客户端可以随意篡改的内容，如果攻击者把Cookie里的字符串改成包含恶意JavaScript代码的内容，eval()会直接执行这段代码，这就相当于给了攻击者在你的页面上执行任意代码的权限，妥妥的XSS攻击风险，绝对要避开。

安全的转换方法 #

根据你给出的字符串格式（"['test','b','c']"），这里有几种靠谱的方法：

方法1：手动拆分解析（适合固定格式） #

既然你的字符串格式是固定的单引号数组，我们可以手动处理：

// 假设从Cookie拿到的字符串是这个
const cookieStr = "['test','b','c']";

// 步骤：去掉首尾的[] → 按逗号分割 → 清理每个元素的单引号和空格
const visitedIds = cookieStr
  .slice(1, -1) // 切掉开头的[和结尾的]
  .split(',') // 把字符串拆成小片段
  .map(item => item.trim().replace(/^'|'$/g, '')); // 去掉每个片段的单引号和前后空格

console.log(visitedIds); // 结果：['test', 'b', 'c']

这种方法完全不会执行任何未知代码，安全性拉满，适合格式固定的场景。

方法2：转成JSON格式解析 #

JSON的标准格式是用双引号包裹字符串，所以我们把原字符串里的单引号换成双引号，再用JSON.parse()解析就行：

const cookieStr = "['test','b','c']";
// 把单引号替换成双引号，变成合法的JSON数组字符串
const validJsonStr = cookieStr.replace(/'/g, '"');
const visitedIds = JSON.parse(validJsonStr);

console.log(visitedIds); // 结果：['test', 'b', 'c']

JSON.parse()只会解析合法的JSON数据，不会执行代码，比eval()安全太多，而且适用性更广。

方法3：从源头规范存储（最推荐） #

其实最好的办法是在把数组写入Cookie的时候，就转成标准的JSON字符串，这样读取的时候直接解析就行，省得后续麻烦：

// 假设你要存储的已访问文章ID数组
const visitedIds = ['test', 'b', 'c'];
// 转成JSON字符串
const jsonStr = JSON.stringify(visitedIds);
// 写入Cookie，这里可以设置路径、过期时间等参数
document.cookie = `visitedArticles=${jsonStr}; path=/; max-age=2592000`; // 存30天

// 读取的时候直接解析
const cookieEntry = document.cookie
  .split('; ')
  .find(row => row.startsWith('visitedArticles='));
if (cookieEntry) {
  const storedIds = JSON.parse(cookieEntry.split('=')[1]);
  console.log(storedIds); // 得到原数组
}

这种方式从一开始就避免了格式混乱的问题，后续操作也更顺畅。

额外小提示 #

• Cookie有大小限制（大概4KB），如果要存的文章ID太多，可能会超出限制，这时候可以考虑用localStorage，它的容量更大（约5MB）。
• 每次添加新的文章ID时，记得先检查数组里有没有这个ID，避免重复存储，保证计数器的唯一性。

内容的提问来源于stack exchange，提问作者xai2