I have a hosted site with a built-in user authentication system, using Node.js as backend.
Is it possible to “embed” an Observable Framework dashboard so that its content only renders after the user logs in?
Sorry if this is a super basic question, I just want to make sure whether it’s a possible scenario - thanks in advance for any guidance!
Could you explain a bit more what you mean by “embed”? The quotes makes me think that you are not thinking of a normal iframe embed…
In general, you should be able to set up a page in your app that is authenticated by your auth system, that could then have an iframe embed with your (separately) hosted framework page.
Hi @Cobus I meant being able to embedding while interact with the framework content; for example, than the logged-in user data (eg., API key) can be passed on to the framework for the data loaders to use it.
OK, I understand what you are trying to do. I am not sure how that would work, though.
Data loaders run at build time, not at runtime, so I don’t think you would be able to pass the API key to a data loader, since the data loader is completely out of the picture when serving the framework page.
Perhaps consider skipping the data loader and just pass the API key as a URL parameter to the embedded page and fetch the data at runtime in your markdown file.
Thanks Cobus! Yes the URL parameter might be an option;
I was also wondering whether storing parameters as cookies could be another option? I believe that even if the Framework is embedded as an iframe it can still read the parent cookies?
Thanks a lot for your patience and help btw!
Cookies in iframes get very tricky in modern browsers, especially when the domain of the top level page and the iframe are different. For example, in Safari and some configurations of Chrome the page in the frame can’t use cookies at all.
If the domain of the embedded iframe is the same as the top level or a subdomain of it, then it’s possible though.