Files
quick-share/docs/08-剪贴板集成(读取-粘贴-降级).md

1.2 KiB
Raw Blame History

08 - 剪贴板集成(读取 / 粘贴 / 降级)

功能目标

  • 支持 Ctrl+V 粘贴文本/文件到传输区域。
  • 支持按钮主动读取系统剪贴板文本(在权限允许的情况下)。
  • 在权限受限或浏览器不支持时提供清晰降级提示。

前端Vue

  • 粘贴事件处理
    • 监听 paste,遍历 e.clipboardData.items
      • kind=file:提取 File走文件传输流程
      • kind=string && type=text/plain:提取文本,填充输入框或直接发送
  • 主动读取剪贴板
    • navigator.clipboard.readText():读取文本并 emit text-pasted
    • 失败提示:“无法读取剪贴板,请手动粘贴”(常见于非 HTTPS、权限未授予、浏览器策略限制
  • 组件建议
    • FileDropZone.vue:承载粘贴与读取按钮
    • utils/clipboard.js:封装权限判断与异常处理(便于复用)

后端Spring Boot

  • 无需专门接口支持;剪贴板只影响前端如何生成 TEXT/FILE 消息。

边界与注意点

  • HTTPS/权限navigator.clipboard 通常要求安全上下文HTTPS/localhost与用户手势。
  • 可用性:粘贴是最稳妥的降级方式,读取按钮只是增强能力。