About the copy and paste function of st.experimental_data_editor

[cyzht]

Summary

When I visit http://localhost:80 , function is ok, but accessing http://192.168.1.1:80 function failure，i can’t paste data。 192.168.1.1 is my computer’s IP address。

Steps to reproduce

Code snippet:

# coding=utf-8

import streamlit as st
import pandas as pd


if __name__ == '__main__':
    df = pd.DataFrame(
        {
            'no': [''],
            'name': [''],
            'conf': [''],
            'count': ['']
        }
    )

    st.experimental_data_editor(df, num_rows='dynamic', use_container_width=True)

If applicable, please provide the steps we should take to reproduce the error or specified behavior.

Expected behavior:

I can paste data from excel when i visit http://192.168.1.1

Actual behavior:

Explain the undesired behavior or error you see when you run the code above.
If you’re seeing an error message, share the full contents of the error message here.

Debug info

• Streamlit version: (Streamlit, version 1.21.0)
• Python version: (Python 3.7.9)
• Using Conda? PipEnv? PyEnv? Pex?
• OS version: windows 7
• Browser version:google chrome 108.0.5359.125

Requirements file

Using Conda? PipEnv? PyEnv? Pex? Share the contents of your requirements file here.
Not sure what a requirements file is? Check out this doc and add a requirements file to your app.

Links

• Link to your GitHub repo:
• Link to your deployed app:

Additional information

If needed, add any other context about the problem here.

[Desert_Candle]

who can teach me about this case?
I had same problem!

[Goyo]

FWIW I can paste from LO Calc using both the local (localhost) and the network (IP) URLs.

[Goyo]

That was using Linux. In Windows I have the same issue. Also the browser says that the connection to the network IP is insecure, which may be related.

[cyzht]

The same result in Linux。
I use Developer Mode（Google Chrome） to debug，show some error message。

[mochimama]

I have the same issue. When I deploy the web, I can do copy/paste excel sheet into interactive table. But as a external user, they can’t copy/paste excel sheet multiple lines into interactive table. There is no error, just can’t copy/paste. I believe it’s related to toml file security configuration about the web. Anybody can help?

[nils-erik]

Just wanted to add onto this thread as another streamlit user experiencing this issue. When fully deployed the copy/paste functionality into the dataframe ceases to work. Hopefully this will be addressed in an upcoming release.

[lukasmasuch]

Hey, the copy/paste functionality of the st.data_editor uses the Clipboard API. This sometimes requires additional settings depending on how the Streamlit frontend is served. If it is served through an iframe, it requires adding the clipboard-write permission to the iframe:

 <iframe allow="clipboard-write;">...

Potentially also the clipboard-read permission, but I’m not 100% certain on this.

Also, on the first paste on the website, the user will get asked to allow this clipboard access:

If the user blocks this access, the feature will not work. It’s also possible that the user has configured the browser to always block this feature.

[camole]

I have the same issue here on ubuntu. In fact, streamlit’s own example has the same issue: st.data_editor - Streamlit Docs. Try copying and pasting in the editable dataframe there, and it won’t paste.

[Goyo]

The embedded apps in the docs are served through an iiframe, so the above comment applies.

[camole]

I see. However, I also have issue with my app deployed on Ubuntu (e.g. copying & paste won’t work when using the network url, but works ok when on local). I got the exact same error as @cyzht.

I think this is probably related to " As with many new APIs, the Clipboard API is only supported for pages served over HTTPS. If your connection is not HTTPS or localhost, then the copy &paste won’t work. See Copy dataframe to clipboard - #14 by MesumRaza

[Jaya_Datta_Sai_K]

This is true, My app had similar issues (direct app not infused in iframe), clipboard API started asking permissions once I added HTTPS support into the app (enabled ssl in kubernetes ingress config for the app)