Javascript webkit-fake-url

use*_*611 12 javascript web-applications image-processing

ID将图像(例如)从剪贴板粘贴到webkit可编辑内容区域时,可能会出现这种情况,源代码如下所示:

webkit-fake-url://DCAC99B9-BA40-4BA7-A419-9C60AAB081DA/image.png 
Run Code Online (Sandbox Code Playgroud)

能够通过javascript访问图像与文本一起发送回服务器?

eye*_*ess 6

显然,你可以使用你喜欢的事件监听器的任何抽象; 我提供了一个未提取的版本; 这也将排除IE <9

if('addEventListener' in editableElement) {
    editableElement.addEventListener('paste', function(e) {
        // First two conditionals should weed out browsers which
        // don't allow access to pasted content
        if(('clipboardData' in e) && ('types' in e.clipboardData) &&
            e.clipboardData.types.indexOf('public.url') > 1) {
            e.target.ownerDocument.execCommand('insertImage', null,
                e.clipboardData.getData('public.url'));
            e.preventDefault();
            e.stopPropagation();
        }
    }, false);
}
Run Code Online (Sandbox Code Playgroud)

在处理WebKit贴纸中的怪异时,检查粘贴事件是个好主意clipboardData:

console.dir(eventObj.clipboardData);
Run Code Online (Sandbox Code Playgroud)

但根据我的经验,Web Inspector似乎在显示控制台时检查内存中的活动对象,而不是调用当时和范围内的对象console.dir.到此为止,paste事件将结束,Javascript对剪贴板的访问权限将被撤销,因此该types属性null将被隐藏,并且实际的剪贴板数据将被隐藏.但是在您的活动中,您可以这样做以更好地了解可用的类型以及它们的输出结果:

for(var i = 0; i < eventObj.clipboardData.types.length; i++) {
    console.log(eventObj.clipboardData.types[i] + ':',
        eventObj.clipboardData.getData(eventObj.clipboardData.types[i]));
}
Run Code Online (Sandbox Code Playgroud)

我花了更多的时间来承认clipboardData在WebKit浏览器中进行调试.希望这可以帮助!

  • 目前(Safari 8.x)没有办法克服"webkit-fake-url`问题"并获得一些真实数据.我调查了每一种可能的方式并总结了我对[CKEditor bug tracker]的印象(http://dev.ckeditor.com/ticket/13029#comment:6). (2认同)