Copy clipboard function working locally but not working server

Question

I am using the below script: It is working locally in visual studio. but in server it throws

"Cannot read property 'write text' of undefined"

 function GetCopyText(thislink) {
    var Content = thislink.parentNode.parentNode.parentNode.parentElement.parentElement.parentElement.parentElement.children[2].children[0].children[0].innerText;

    navigator.clipboard.writeText(Content).then(function () {
        // alert('Async: Copying to clipboard was successful!');
    }, function (err) {
        console.error('Async: Could not copy text: ', err);
    });
}

this appears to be JavaScript which runs in the browser, nothing to do with servers really. In which browser(s) are you trying to execute this code? You may find https://caniuse.com/#feat=clipboard useful — ADyson, Aug 28 '18 at 10:14
Pretty sure the protocol must be HTTPS or localhost and/or permissions granted in browser. — Adrian, Aug 28 '18 at 10:17
i am using in google chrome Version 68.0.3440.106 (Official Build) (64-bit) — Daniel Stephen, Aug 28 '18 at 10:30
Possible duplicate of [navigator.clipboard is undefined](https://stackoverflow.com/questions/51805395/navigator-clipboard-is-undefined) . See also https://developers.google.com/web/updates/2018/03/clipboardapi — ADyson, Aug 28 '18 at 12:20
If you're using node.js - this package solves the issue: https://www.npmjs.com/package/clipboard-copy — zilijonas, Oct 29 '18 at 11:52

score 64 · Answer 1 · answered Dec 07 '19 at 00:04

64

Make the protocol https and the browser should run it.

answered Dec 07 '19 at 00:04

Wade T.

641
5
3

3

Yes, clipboard can only be accessed in a secure context. – Akshay K Nair Jan 05 '22 at 09:11
I lost 2 hours with this thing! thnx – Stavros Jan 27 '22 at 14:05

score 14 · Answer 2 · answered Feb 04 '22 at 10:23

Clipboard feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

https://developer.mozilla.org/en-US/docs/Web/API/Clipboard

Thanks Wade

Suggestions: its better to check navigator.clipboard value and proceed only if exists. This provides good user experience and In large organizations, since many developers will be running UI in local mode for testing, It saves their debugging time and then figure out navigator.clipboard is not available in local mode without https.

Copy clipboard function working locally but not working server

2 Answers2