I was trying to build a custom component using local-forge for storing client data on client’s browser and then retrieve it when the user revisits the app. It looks like the iframe for custom components is sandboxed and not allowed to access local-storage/indexdb etc. is there any work-around to this ?
Thanks in advance !
Hey @ash2shukla, unfortunately this is not possible for now 
there’s a thread on this starting in the middle of this convo : Disqus component (WIP) and a solution involving starting a server on another thread and iframing it back into Streamlit.
A more official workaround is in the works but I’m not expecting that soon (@tim don’t hesitate to chime in to provide more info 
)
Fanilo
1 Like
Hey @ash2shukla - @andfanilo is correct, we don’t currently support this. The issue is that we omit the allow-same-origin sandbox flag on the component iframe for security reasons - and unfortunately, the localStorage API will not work without that flag.
As @andfanilo mentioned, we’re evaluating the various ways we could support this sandbox flag without opening a security hole – but there’s no timeline for that, currently.
There is a workaround, however: it’s sort of a pain, but if you’re able to use components.iframe - that is, if you can host your component externally, and it doesn’t require bi-directional communication with Streamlit - then your component’s iframe will have the allow-same-origin flag. (I realize this is not an acceptable workaround for many use cases, but I’m putting it out there in case it would work for you.)
2 Likes
With Streamlit 0.73 the CORS block measure was lifted, could you try again on your component to see if other problems pop up ?
Fanilo
Hey @andfanilo
Yep it works ! Checked it last night. I am working on a example to manage state management using client storage. 
Was occupied with some office work will share the results with you guys when its complete. 
3 Likes
I am working on a example to manage state management using client storage
Great 
I’d rather contribute to it rather than reimplemeting one XD (it’s in my todo list but my todo list is rather large rn 
)
Wish I could show you my todo list. That would definitely make you feel better. 
1 Like
Hi @ash2shukla - just wondering if you have a pointer to your local storage solution? Does it allow for persisting the session from st so it’s available in a component and vice versa, can something stored via the component be available in st?
Thanks!
Hi @asehmi ,
All that the solution requires is a wrapper over localStorage and sessionStorage web apis.Web Storage API - Web APIs | MDN
Once you have this component in place you can definitely use it to save state of widgets on client side in session and across sessions.
I was supposed to complete it weeks ago but haven’t been able to do so due to office work. 
Maybe you can take the idea forward and publish your component
Hope it helps!
1 Like
I’ll give it a go this weekend and very happy to publish the solution if I get it working.
Cheers!
1 Like
I have this working and am writing it up. The app demonstrates bi-directional Streamlit-to-Component communication, integrated authentication with Auth0 IdP which supplies jwt tokens which can be used to call secure API endpoints. The component is written in Next.js so can take advantage of its “serverless” API goodness.
2 Likes
The component is written in Next.js so can take advantage of its “serverless” API goodness.
While I’m hyped by the problem your component solves (it’s been a pain point for quite some time here), actually i’m even more hyped by having a Next.js component example 
I want my next component to use Next.js so it’s easy to build a component library where a path directly maps to a React component, so I’ll probably dig into your code 
(and who knows, maybe do a template for it, or ask for some of your input to build one)
Anyway, feel free to create a new topic with the release of your component instead of having it buried at the end of this one 
Fanilo
2 Likes
@andfanilo Go get it
2 Likes