[w3c/clipboard-apis] Support for putting images on the clipboard (#44)

The current specified API lacks the ability to put images on the clipboard. This seems to be motivated by the concern for exploitation of security vulnerabilities in external applications (e.g. as voiced in #41 and https://lists.w3.org/Archives/Public/public-webapps/2015AprJun/0819.html).

Chrome and Firefox currently already have the ability to copy an image via the "Copy Image" context menu option, and choosing the option allows the copied image to be used in other image editing applications. In both cases, the implementation re-encodes the image before the image is exported. This technique can also be used to support putting images on the clipboard without the security concern.

To support images, at the bare minimum one image should be put on the clipboard. Other considerations are:

- Are there requirements on the images that can be copied (e.g. PNG, JPG, GIF)?
- Are there requirements on the actual copy of the image (e.g. copy as-is, convert to PNG, convert to same MIME).
- What is the number of images that can be copied (just one?)
- When does the image conversion occur (sync vs async).
- How does the API look like? (Is the image provided as a Blob/File, as a canvas/img, or maybe a typed array or string?)
- In case of animated images, which frames are copied (all? any one? the first frame?)
- Can the copied image be retrieved again from the DataTransfer instance?
- Is the answer to the previous question different for cut/copy (`navigator.clipboard.write`) and paste (`navigator.clipboard.write`)?

I submitted a patch to Firefox that offers the ability to copy images (https://bugzilla.mozilla.org/show_bug.cgi?id=1356543#c14). This is intended to be a temporary solution until we can agree on a common implementation to be shared between browsers.

```javascript
// In a copy/cut event:
event.preventDefault();
event.clearData();

var blob = new Blob(['image data here'], {type: 'image MIME type here'});
event.clipboardData.mozSetDataAt('application/x-moz-nativeimage', blob, 0);
// Or, using strings (because setData is specced to only contain strings):
event.clipboardData.setData('application/x-moz-nativeimage', 'PNG image data here');
```

Within the cut/copy event, whatever that is assigned to the `DataTransfer` instance (=`event.clipboardData`) can be accessed as-is (via `getData` or `mozGetDataAt`). If the result is pasted, `event.clipboardData` in the paste event (same or other browser) will contain a `File` of type `image/png` (=the converted image, the first frame of the original image). When pasted in an image editor, the image appears as expected.



-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/clipboard-apis/issues/44

Received on Wednesday, 5 July 2017 15:45:01 UTC