Forums

TypeError: navigator.clipboard is undefined

I have an inline JS code in my HTML and it is working on my local machine, but it is not working after I deploy it on the Pythonanywhere. The JS code is:

    <script>
    document.getElementById("copy-button").addEventListener("click", function () {
        var buildingData = ('{{ project_json|escapejs }}');
        navigator.clipboard.writeText(buildingData).then(function () {
            alert("Model data copied to clipboard!");
        })
            .catch(function (err) {
                console.error("Failed to copy model data: ", err);
            });
    });
   </script>

And the error which I get in console log by clicking on button is:

TypeError: navigator.clipboard is undefined

I appreciate any help to solve this issue.

hajipour | 2 posts | June 12, 2023, 11:44 a.m. | permalink

Where is navigator coming from? Is there a script which isn't loading when you load the page on pythonanywhere?

Staff sboyd | 279 posts | PythonAnywhere staff | June 12, 2023, 3:25 p.m. | permalink

What you mean where is it coming from? I added the JS code above as well.

I have a HTML page and part of that is this JS code. The data of model should be copied to clipboard when user clicks on the button.

    <button class="btn btn-secondary" id="copy-button">Copy the project to Clipboard</button>
    <script>
    document.getElementById("copy-button").addEventListener("click", function () {
        var buildingData = ('{{ project_json|escapejs }}');
        navigator.clipboard.writeText(buildingData).then(function () {
            alert("Model data copied to clipboard!");
        })
            .catch(function (err) {
                console.error("Failed to copy model data: ", err);
            });
    });
   </script>
hajipour | 2 posts | June 12, 2023, 6:03 p.m. | permalink

Take a look at https://stackoverflow.com/questions/51805395/navigator-clipboard-is-undefined

Staff fjl | 4348 posts | PythonAnywhere staff | June 13, 2023, 7:28 a.m. | permalink