How to load user data after authorization in SPA?

Question

JavaScript

There is a site on SPA, more precisely on Vue, but that's not the point. There is authorization through the social. networks. I don't quite understand how to do it right. Authorization goes like this: The user clicks on the authorization button, a new window opens, there (an example with Google) they are asked to select an account for authorization, after the data is sent to the backend part (php), after the logic, the hash is written to the cookie. There is a small problem here, it always throws an Unknown authorization error, but at the same time the data comes from Google, it is written to the database. This is problem. move on.
What to do next? Close the window with window.close. And here is the question. Making a socket that will constantly ask if the user is authorized by checking cookies is not very familiar with sockets, so talking nonsense. Or is it somehow possible from the window that I close window.close to say that the main tab is updated and the type is checked, if there is a hash, then send a request for data? How to implement?

Answer 1

It seems that when authorization goes through Google, it should not open a new window, but there is a transition in the same window to the Google server to the page with the account selection / authorization form. After choosing an account, you are redirected back to your site via redirectURI. You bind both the server side and the client side to redirectURI in order to display or redirect the user to the correct page after authorization.
Here, for example, https://www.toggl.com/ you can check how Google authorization works.