I am building a microsoft teams tab and I'd like to be able to authenticate with an existing sso flow. However, the way teams work is that it embeds your app in an iframe. So I have an iframe of domain-x with a button that opens up domain-y and has some redirects as part of the auth process. Let's say the team's client is at domain-z.
So;
domain-x is an iframe in domain-z. There is a button in domain-x that opens domain-y. I want to be able to communicate back to domain-x iframe but it seems like window.parent = window.self and window.opener = null when I open the popup so I can't use parent.postMessage with an event listener. There is some cross-site security at play here which is really tricky.
in domain-x
<button onclick="window.open('domain-y', 'popup=true')">
in domain-y
<script>
parent.postMessage("done", "*")
</script>
in domain-z
<iframe :src="domain-x"></iframe>
Is there any way I can get domain-y to post a message back to domain-x?
If this is simply not possible, maybe I save the result of the authentication in a database and poll it from the parent iframe and if I find a result I redirect? Has anyone done this before? Any advice would be helpful.
The SSO story has changed a HUGE amount over the years with Teams and improved dramatically, so you (a) aren't ABLE to launch own popup but (b) don't NEED to launch one. Please follow the latest docs and you should come right: https://learn.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/authentication/tab-sso-overview