How to prevent pasting value outside of spreadjs (data privacy) worksheet?

How to prevent pasting value outside of spreadjs (data privacy) worksheet?

Posted by: roywebweb123 on 29 January 2021, 5:44 pm EST

• 

  roywebweb123

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 29 January 2021, 5:44 pm EST

  How to prevent a user from copying a value on spreadjs and pasting outside of spreadjs?

  Thanks

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 3 February 2021, 4:11 am EST

  Hi,

  Apologies for the delayed response. For this, you need to disable the cut, Copy paste from the Global keys and also from the CellType. Please refer to the following code snippet and attached sample that demonstrates the same.

  
  GC.Spread.Sheets.CellTypes.Text.prototype.isReservedKey = function (
    e,
    context
  ) {
    //cell type handle ctrl c,v,x key by itself(doesnt call the copy paste cut actions)
    return (
      (e.keyCode === 67 || e.keyCode === 88 || e.keyCode === 86) &&
      e.ctrlKey &&
      !e.shiftKey &&
      !e.altKey
    );
  };
  //html
  <div
        oncopy="return false"
        oncut="return false"
        onpaste="return false"
        id="ss"
      ></div>
  
  

  sample: https://codesandbox.io/s/icy-framework-tf7vw?file=/src/index.js

  Regards
  
  Avinash

• 

  roywebweb123

  • Post Options:
  • Link
    Copy

  Posted 13 February 2021, 5:47 pm EST

  Hi Avinash, thanks for the response. I try to convert your solution into React.js, but I unable to get it to work.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 15 February 2021, 8:46 am EST

  Hi,

  As a better alternative, you could just remove shortcut bindings for copy and paste command. Please refer to the following code snippet and the sample demonstrating the same:

  const commandManger = spread.commandManager();
      // disable copy
      commandManger.setShortcutKey(null, 67, true, false, false, false);
      // disable cut
      commandManger.setShortcutKey(null, 88, true, false, false, false);
  

  https://stackblitz.com/edit/react-cfprvb?file=src%2FApp.js

  Regards
  
  Sharad

• 

  roywebweb123

  • Post Options:
  • Link
    Copy

  Posted 16 February 2021, 10:31 pm EST

  Hi Sharad, thanks for the response. I try your code snippet and sample on stackblitz.com, but it not working. I can still copy and cut.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 17 February 2021, 6:52 am EST

  Hi,

  Please try by registering an empty command as demonstrated in the following sample and let me know if the issue persists for you:
  
  https://stackblitz.com/edit/react-hyuezv?file=src%2FApp.js

• 

  roywebweb123

  • Post Options:
  • Link
    Copy

  Posted 17 February 2021, 8:59 pm EST

  It still not working for me. I think it because I using Mac. I try it on a window pc and it work.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 18 February 2021, 1:37 am EST

  For Mac, you need to pass the meta parameter as true in setShortcutKey. Please refer to the following code snippet and attached updated sample that demonstrates the same.

  
    // disable copy
      commandManger.setShortcutKey("emptyCommand", 67, false, false, false, true);
      // disable cut
      commandManger.setShortcutKey(
        "emptyCommand2",
        88,
        false,
        false,
        false,
        true
      );
  
  

  sample: https://stackblitz.com/edit/react-efjjww?file=src/App.js

  API reference:
  
  https://www.grapecity.com/spreadjs/docs/v14/online/SpreadJS~GC.Spread.Commands.CommandManager~setShortcutKey.html

• 

  roywebweb123

  • Post Options:
  • Link
    Copy

  Posted 22 February 2021, 9:02 pm EST

  Thank Sharad, I got it to work.

  Is it possible to prevent the user from copying a value in spreadjs and pasting that value on a different website without disabling copy or cut?

  The user should be able to use the copy and cut shortcut keys, but they cannot paste the value on a different website.

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 23 February 2021, 4:31 am EST

  Hi,

  For this, you may set the contextMenu cut, copy, paste commands to the shortcut keys. Please refer to the following updated sample that demonstrates the same.

  sample: https://stackblitz.com/edit/react-ghql5m?file=src/App.js

  Regards
  
  Avinash

• 

  roywebweb123

  • Post Options:
  • Link
    Copy

  Posted 23 February 2021, 9:26 pm EST - Updated 3 October 2022, 9:57 am EST

  Thanks Avinash

  I found a bug where a user can still copy and paste a value to other website by double clicking a cell, highlight the text, and use copy shortcut key. Is there a way to prevent this?

  

  1135×906 34.8 KB

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 24 February 2021, 1:16 am EST

  Hi,

  This is the expected behavior from SJS. Inside the Edit mode, actions like copy, paste, cut, ctrl+a are not handled by SJS instead of that global events are performed. For handling this case you override the isReservedKey method. Please refer to the following code snippet and attached updated sample that demonstrates the same.

  
  let old = GC.Spread.Sheets.CellTypes.Text.prototype.isReservedKey;
  GC.Spread.Sheets.CellTypes.Text.prototype.isReservedKey = function(e, context) {
    //cell type handle ctrl+c,v,x key by itself
  
    if (context.isEditing) {
      return (
        (e.keyCode === GC.Spread.Commands.Key.c ||
          e.keyCode === GC.Spread.Commands.Key.v ||
          e.keyCode === GC.Spread.Commands.Key.x) &&
        e.metakey &&
        (!e.shiftKey && !e.altKey)
      );
    } else {
      old.apply(this, arguments);
    }
  };
  
  

  sample: https://stackblitz.com/edit/react-1174ks?file=src/App.js

  Regards
  
  Avinash

• 

  ryan.liang

  • Post Options:
  • Link
    Copy

  Posted 25 February 2021, 12:18 pm EST

  Avinash, thank you so much for the detailed explanation, you save the day!

  I have been trying to get the same thing to work.

  I am glad my team chose spreadjs over other library. Experts from the support team like Avinash really make a huge difference.

• 

  diwakar.s.maurya

  • Post Options:
  • Link
    Copy

  Posted 4 June 2024, 3:32 am EST

  I am trying to make this work for SpreadJS-Designer too but unable to disable the copy,cut,paste using the code samples provided here. Can you please help?
  
  Also the examples posted on this thread on https://stackblitz.com are not working.

• 

  priyam.kushwaha

  

  • Post Options:
  • Link
    Copy

  Posted 5 June 2024, 4:36 am EST

  Hi,

  As per my understanding, you wish to prevent copying from SpreadJS to any other platform. The solution provided earlier was for version 14, but it seems you are using a higher version. It appears there have been internal changes in the higher versions, which might be why the previous solution isn’t working.

  You can achieve this by handling the copy, cut, and paste events, preventing their default behavior, and then manually implementing the desired copy, cut, and paste functionality according to your requirements. Please refer to the attached snippet and sample for guidance.

  spread.getHost().addEventListener("cut", (e) => {
          e.preventDefault();
          e.stopPropagation();
      }, true)
      spread.getHost().addEventListener("copy", (e) => {
          e.preventDefault();
          e.stopPropagation();
      }, true)
  
      spread.getHost().addEventListener("paste", (e) => {
              e.preventDefault();
              e.stopPropagation();
              
              spread.commandManager().execute({
                  cmd: "paste",
                  sheetName: spread.getActiveSheet().name()
              });
      }, true)

  Sample: https://jscodemine.mescius.io/share/CjZIrFjBI021fOHwIwnlKw/?IsEmbed=false&Theme=Unset&PreviewDirection=0&IsEditorShow=true&IsExplorerShow=true&IsPreviewShow=true&IsConsoleShow=true&IsRunBTNShow=false&IsResetBTNShow=false&IsOpenInCodemineBTNShow=false&PanelWidth=20&PanelWidth=50&PanelWidth=30&defaultOpen={"OpenedFileName"%3A["%2Findex.html"%2C"%2Fsrc%2Fapp.js"]%2C"ActiveFile"%3A"%2Fsrc%2Fapp.js"}

  Regards,
  
  Priyam

• 

  diwakar.s.maurya

  • Post Options:
  • Link
    Copy

  Posted 5 June 2024, 3:00 pm EST

  Thank you. It works as expected.

  I would like to make small addition to the suggested code. Without it, users can still copy/cut from the formula bar.

  document.addEventListener('cut', (e) => {
    e.preventDefault();
    e.stopPropagation();
  }, true)
  
  document.addEventListener('copy', (e) => {
    e.preventDefault();
    e.stopPropagation();
  }, true)

• 

  priyam.kushwaha

  

  • Post Options:
  • Link
    Copy

  Posted 6 June 2024, 9:05 am EST

  Hi,

  We are still investigating the issue at our end. We will let you know about our findings as soon as possible.

  Regards,
  
  Priyam

• 

  priyam.kushwaha

  

  • Post Options:
  • Link
    Copy

  Posted 7 June 2024, 1:09 am EST

  Hi,

  Yes, this can be used to prevent copying or cutting from the formula bar, but the snippet code will block copying and cutting throughout the entire document. To address this, you should check if the target element is the formula bar. If it is, then prevent copying or cutting. Please refer to the attached snippet.

  document.addEventListener('cut', (e) => {
          if (e.target.parentElement.parentElement.getAttribute("gcuielement") == "gcAttachedFormulaTextBox") {
              e.preventDefault();
              e.stopPropagation();
          }
      }, true)
      document.addEventListener('copy', (e) => {
          if (e.target.parentElement.parentElement.getAttribute("gcuielement") == "gcAttachedFormulaTextBox") {
              e.preventDefault();
              e.stopPropagation();
          }
      }, true)

  Regards,
  
  Priyam