关于navigator.clipboard.writeText使用遇到的坑
·
navigator.clipboard.writeText在http协议下不可用的坑,浏览器禁用了非安全域的 navigator.clipboard
对象,安全域包括本地访问与开启TLS安全认证的地址,如 https
协议的地址、127.0.0.1
或 localhost
。(其实主要是http属于非安全域)下面的方法属于兼容了http的
function copyToClipboard(textToCopy) {
// navigator clipboard 需要https等安全上下文
if (navigator.clipboard && window.isSecureContext) {
// navigator clipboard 向剪贴板写文本
return navigator.clipboard.writeText(textToCopy);
} else {
// 创建text area
let textArea = document.createElement("textarea");
textArea.value = textToCopy;
// 使text area不在viewport,同时设置不可见
textArea.style.position = "absolute";
textArea.style.opacity = 0;
textArea.style.left = "-999999px";
textArea.style.top = "-999999px";
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
return new Promise((res, rej) => {
// 执行复制命令并移除文本框
document.execCommand('copy') ? res() : rej();
textArea.remove();
});
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)