Monday, 1 August 2022

oAuth flow of data from third party domain

I have made a website that enables users to create their own widgets and place them on their own websites. I want users of those websites to be able to log in to these widgets using Twitter, Facebook and Google. I have 99% of the process in place, but the remaining 1% is my stumbling block. The process I have implemented is as follows:

  1. User creates a widget on my site (mysite.com)
  2. User places some javascript on their own website (example.com) to embed the widget
  3. The user of a widget clicks "Log in with Twitter"
  4. A new window is opened (using window.open) which loads mysite.com/auth/twitter, redirecting them through the oAuth flow on twitter.com
  5. All being well, the user gets redirected back to mysite.com/auth/twitter/callback in the new window and I store the user's details in the database on mysite.com.

At this point, the newly-created User ID should be passed back to the main window in which the widget is embedded. But, as far as I can tell, there is no way to do so because because window.opener in the new window is null (due to the redirects that have happened). Nor do I have a reference from the main window to the new window, also due to the redirects.

I have tried window.postMessage from the new window to the main window, directly accessing functions and variables in the new window from the main window, all to no avail. There is seemingly no way to reference any data or properties from either window.

Is there anything else I can try or do I have to implement the process without a new window somehow?

If it matters, mysite.com is built in Laravel and the social authentication process uses Socialite.

Any help is appreciated!



from oAuth flow of data from third party domain

No comments:

Post a Comment