Geek Answers Handbook

Any way to react in a popup to communicate with the parent window?

I have an OAuth process that pops up a window, but when I log in, redirecting to the OAuth callback page happens in a popup window, not in the parent window ( window.opener ). This may be a bit hacked, but I would like a pop-up to tell my parents: "We are authorized!"

This really works:

 OAuthCallback = React.createClass({ displayName: 'OAuthCallback', render() { window.opener.console.log('hello parent window'); return ( <div> Hi, OAuth is process is done. </div> ) } });

But I am wondering if there is a way that I can open the popup so that the parent window calls the prop function, for example. this.props.oauthSucceeded() .

+6
source share
2 answers

If you cannot establish relationships between parents and children between components, React recommends setting up an event system.

For communication between two components that do not have parent-child, you can configure your own global system event. Subscribe to events in the component DidMount (), unsubscribe in componentWillUnmount () and call setState () when you receive the event. A flow pattern is one of the possible ways to organize it.

see https://facebook.imtqy.com/react/tips/communicate-between-components.html

Take a look at window.postMessage for internetworking ( https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage )

+10
source

Eelke's offer was in place.

I used window.postMessage() in the child window, then window.close() , then added window.addEventListener('message', function(){}) to the componentDidMount method of the main / main component.

For more information contact https://facebook.imtqy.com/react/tips/dom-event-listeners.html !

+2
source

More articles:


All Articles