在浏览器中复制到剪贴板BINARY数据

时间:2012-12-12 20:48:22

标签: javascript flash coffeescript clipboard

复制到剪贴板功能的最新技术(我的调查)

Flash替代

HTML5替代

草稿中有一个用于标准化剪贴板事件的API,但目前尚未在任何浏览器中实现http://dev.w3.org/2006/webapi/clipops/

我的Rails / Zclip实现

我正在使用zclip(基于zeroclipboard)将文本从restfule服务复制到系统剪贴板:

$('.copy-to-clipboard').zclip
  path:'/ZeroClipboard.swf'
  setHandCursor: true
  copy: -> 
    ajaxReturn = $.ajax
     type: 'GET'
     async: false
     url: '/resources/copy_to_clipboard/' + $(this).attr("class").match(/[0-9]+/)
    return ajaxReturn.responseText

这是coffeescript。

如果服务(/ resources / copy_to_clipboard /)提供文本,则将其复制到右侧。但如果它服务于DOCX文件,它不会直接复制到剪贴板。看一下rails控制器:

  def copy_to_clipboard
    send_file @resource.resource_content.content.file.file, :type => 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
  end

问题

您是否随时解决了将BINARY数据复制到剪贴板的问题?怎么样?

由于

1 个答案:

答案 0 :(得分:0)

我阅读Clipboard API and events并编写以下代码,这对我有用。唯一的问题是使用NULL (0x0)值。使用代码的方法是使用所需的二进制值设置x数组并调用document.execCommand('copy')函数,祝贺您的数据在剪贴板中!

var x = [0x1b, 0x68, 101, 108, 108, 0x6f, 0x7, 0x8];
var button = document.getElementById("copy-button");

button.addEventListener("click", function() {
  document.execCommand('copy');
}, false);

document.addEventListener('copy', function(e) {
  var str = '';
  x.forEach(function(d) {
    str += String.fromCharCode(d)
  })
  //You can ignore setting third parameter value
  e.clipboardData.setData('text', str, true);
  console.info('data copied');
  e.preventDefault();
});
<button type="button" id="copy-button">Copy to clipboard</button>

这是粘贴结果在Notepad ++中,Show All Characters菜单项为: enter image description here
我希望这会有所帮助;)