Re: [w3c/clipboard-apis] Proposal: Identifying whether the clipboard has changed without re-reading it (Issue #232)

roraja left a comment (w3c/clipboard-apis#232)

The primary usecase  (Scenario 2 in the explainer) can also be achieved today without the contentsId, on chromium based browsers or any browser that supports web custom formats, as follows:

 The web page can maintain a simple sequence number as a unique version identifier to remote clipboard contents and add it to a web custom format. And when remote clipboard changes, this version can be incremented and stored at following two locations.

1.) In local clipboard in a custom data type, along with other remote clipboard contents
2.) locally within the web page (and shared with all other tabs showing the same remote desktop).

When clipboardchange event is triggered upon writing remote clipboard contents to local clipboard, we can read this unique version identifier by reading the custom format using async clipboard read API. If this value is same as the one stored within the web page, we can infer that the clipboard have contents which originated from the remote machine and hence we can avoid sending the updates to the remote server.

Here is a code snippet to implement the same:

```javascript
async function onRemoteClipboardChanged(){
    // Increment a sequence number which tells n'th change done by remote
    // This can be synced between other tabs so other tabs ignore the same change
    sequenceNumber++;
    
    const remote_version = sequenceNumber.toString();
    const sequenceNumberBlob = new Blob([remote_version], { type: 'web vdi/clipboard' });
    const text_data = "Some remote clipboard data - " + remote_version;
    const textBlob = new Blob([text_data], { type: 'text/plain' });
    
    const clipboardItem = new ClipboardItem({ 'web vdi/clipboard': sequenceNumberBlob, 'text/plain': textBlob });
    await navigator.clipboard.write([clipboardItem]);
    
    // Store the current version to compare with next clipboard change event
    currentVersion = remote_version;
}

// Clipboardchange event handler
async function onClipboardChange(e) {
  try {
    const clipboardItems = await navigator.clipboard.read();
    let formats = {};

    for (const item of clipboardItems) {
      log(`Trying to read custom format "web vdi/clipboard" from clipboard data`);
      if (item.types.includes("web vdi/clipboard")) {
        const sequenceBlob = await item.getType("web vdi/clipboard");
        const sequence = await sequenceBlob.text();
        if(sequence == currentVersion){
          log(`Current clipboard has same version as last detected on remote change, IGNORING this event`);
          return;
        }
      }else{
        log(`No custom format web vdi/clipboard found in clipboard data, FORWARDING changes to remote server`);
      }
    }
  }
}

```
Here is a sequence diagram to illustrate the scenario:

<img width="1492" alt="Image" src="https://github.com/user-attachments/assets/dc5f7693-2ec1-4bf4-9ef2-4b6b9a56111e" />

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

Message ID: <w3c/clipboard-apis/issues/232/2668231756@github.com>