解决从剪贴板粘贴数据到localStorage出现Promise对象异常问题

你的粘贴功能出现{"[object Promise]":"[object Promise]"}的问题，核心原因是没正确处理异步操作，且没有解析JSON并逐个存入键值对，以下是修复方案：

原代码的问题点 #

• navigator.clipboard.readText()是异步方法，直接赋值给raw会得到Promise对象，而非实际的剪贴板文本
• localStorage.setItem(raw, raw)是把整个Promise对象转成字符串后当成单个键值对存入，不是解析JSON后批量写入键值
• readText()不需要传参数，原代码里的JSON.stringify()是多余的

修复后的完整代码 #

// 从剪贴板导入JSON到localStorage
async function loadJson() {
  try {
    // 1. 异步读取剪贴板文本
    const rawText = await navigator.clipboard.readText();
    // 2. 解析JSON为对象（严格校验格式）
    const data = JSON.parse(rawText);
    
    // 可选：先清空原有localStorage数据，避免新旧数据混合
    localStorage.clear();
    
    // 3. 遍历JSON对象的键值对，逐个存入localStorage
    Object.entries(data).forEach(([key, value]) => {
      localStorage.setItem(key, value);
    });
    
    console.log('数据成功导入localStorage');
  } catch (e) {
    // 处理各种错误：剪贴板读取失败、JSON格式错误等
    console.error('导入失败:', e.message);
    alert('导入失败，请检查剪贴板内容是否为合法JSON格式');
  }
}

关键说明 #

• 必须用await等待readText()完成，才能拿到实际的文本内容
• 使用JSON.parse()解析剪贴板的JSON字符串，确保得到可遍历的对象
• 通过Object.entries()遍历键值对，调用localStorage.setItem()逐个写入，这样才能还原成原来的存储结构
• 加入了错误处理，能提示用户剪贴板内容是否合法

内容的提问来源于stack exchange，提问作者Максим Пилипчук