之前在使用天猫，发现分享某个商品给朋友，都是跳出复制成功去黏贴的提示，然后到第三方社交软件黏贴分享，朋友复制对应分享内容，打开天猫后就自行分析跳转到对应的产品，原来app间除了URL Scheme传递数据，还可以通过剪贴板进行，真是聪明的不要不要的٩(˃̶͈̀௰˂̶͈́)و
天猫的这一分享行为是用户主动触发的，而我们现在要做的是浏览器或者第三方app内的webview无感进行复制，也就是说要直接操作剪贴板且用户无需长按触发系统的复制行为，难点也是在这里
iOS10前出于安全原因并未允许 JS 直接操作剪贴板，用户须通过按键的方式主动触发，要实现这一功能，大部分均是利用 flash 插件，ZeroClipboard 就是基于 flash 的，其原理就是利用透明的 flash 覆盖在复制按钮上，点击 flash，将复制内容传入到 flash 中，再通过 flash 把传入的内容写到剪贴板上，手机上浏览器不能用（据说貌似也会加入clipboard.js相同的功能支持了）
iOS10之后系统允许 JS 直接访问剪贴板，那这里就要说一个目前iOS10之后运作良好的且不需要flash，将文本复制到剪贴板最轻便的插件：clipboard.js
Copying text to the clipboard shouldn't be hard. It shouldn't require dozens of steps to configure or hundreds of KBs to load. But most of all, it shouldn't depend on Flash or any bloated framework.
其核心主要是下面这句：
document.execCommand('copy')//或者cut
在个性化安装的三个个体方案中，从流程顺畅无感、匹配度综合来说，这个方案应该算是最佳选择，简单测试发现在手机上，目前主流的浏览器（Safari／百度／UC），第三方社交app（微信／QQ）打开的webview均有较好的支持
- 通过剪切板在app间传递数据的流程较为简单
- js黏贴相关个性化信息至剪贴板
- app在启动或者激活时通过UIPasteboard读取剪贴板字符串
- 解析对应字符串即可
- clipboard.js 简单的使用
- 引入下载好的clipboard.js插件
<script src="dist/clipboard.min.js"></script>
或者直接使用网络资源
- 实例化Clipboard
<script>
var clipboard = new Clipboard('.btn', {text : function () {
var cookie = document.cookie;
var testcookies = cookie.match(/testcookie=(\w+)/);
return "test1.liya://testcookie/" + testcookies[1];
}});
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
</script>
- 定义点击按钮（因为偶这里需要的是无痕的复制隐藏的个性化内容—动态地设置一个文本，就不需要定义复制的对象了）
<button class="btn" data-clipboard-action="copy">复制喽</button>
这一步还有多种用法，可自行查阅官方文档，用法写的相当简单详尽
- UIPasteboard 简单使用
获取设备的剪贴板很简单，第一行代码就完事嘞
NSString *clipboardStr = UIPasteboard.generalPasteboard.string;
以上就完成了剪贴板传递数据啦，更多app剪贴板使用请查阅 UIPasteboard
网友评论