PyScript Error Unable to use SharedArrayBuffer due insecure environment

I’m using PyScript to run a simple Python script in my HTML file to display a pandas DataFrame. However, I’m encountering an error related to SharedArrayBuffer due to an insecure environment.

Environment:

  • Running the application locally using VSCode Live Server.

  • PyScript version: 2024.6.2

  • Python library: pandas

Steps to Reproduce:

  1. Create an HTML file with the below code.

  2. Open the HTML file.

  3. run the py-editor code block

  4. Observe the error in the browser console.

Question:

How can I resolve this SharedArrayBuffer issue when running PyScript? image of the error

Below is my HTML code:

<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <link rel="stylesheet" href="https://pyscript.net/releases/2024.6.2/core.css">
        <script type="module" src="https://pyscript.net/releases/2024.6.2/core.js"></script>

        <style>
            #loading { outline: none; border: none; background: transparent }
        </style>

        <script type="module">
            const loading = document.getElementById('loading');
            addEventListener('py:ready', () => loading.close());
            loading.showModal();
        </script>
        
        <py-config>
            packages = ["pandas"]
        </py-config>
    </head>

    <body>
        <dialog id="loading">
            <h1>Loading...</h1>
        </dialog>

        <script type="py-editor">df</script>

        <script type="py">
            import pandas as pd
            data = {
                'Name': ['Alice', 'Bob', 'Charlie'],
                'Age': [25, 30, 35],
                'City': ['New York', 'Los Angeles', 'Chicago']
            }
            df = pd.DataFrame(data)
        </script>

    </body>
</html>