66 lines
1.5 KiB
React
66 lines
1.5 KiB
React
|
import Cookies from 'universal-cookie';
|
||
|
|
import * as React from 'react';
|
||
|
|
|
||
|
|
export default class OauthPopup extends React.PureComponent {
|
||
|
|
static defaultProps = {
|
||
|
|
onClose: () => {},
|
||
|
|
width: 500,
|
||
|
|
height: 500,
|
||
|
|
url: '',
|
||
|
|
title: '',
|
||
|
|
type: '',
|
||
|
|
};
|
||
|
|
|
||
|
|
externalWindow = null;
|
||
|
|
codeCheck = null;
|
||
|
|
|
||
|
|
createPopup = () => {
|
||
|
|
const cookies = new Cookies();
|
||
|
|
const { url, title, width, height, onCode } = this.props;
|
||
|
|
const left = window.screenX + (window.outerWidth - width) / 2;
|
||
|
|
const top = window.screenY + (window.outerHeight - height) / 2.5;
|
||
|
|
|
||
|
|
cookies.set(`oauth-${this.props.type}`, '1', { path: '/' });
|
||
|
|
|
||
|
|
this.externalWindow = window.open(
|
||
|
|
url,
|
||
|
|
title,
|
||
|
|
`width=${width},height=${height},left=${left},top=${top}`
|
||
|
|
);
|
||
|
|
|
||
|
|
this.codeCheck = setInterval(() => {
|
||
|
|
if (this.externalWindow.closed) {
|
||
|
|
cookies.remove(`oauth-${this.props.type}`);
|
||
|
|
this.props.onClose();
|
||
|
|
clearInterval(this.codeCheck);
|
||
|
|
}
|
||
|
|
try {
|
||
|
|
const params = new URL(this.externalWindow.location).searchParams;
|
||
|
|
const code = params.get('code');
|
||
|
|
if (!code) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
clearInterval(this.codeCheck);
|
||
|
|
onCode(code, params);
|
||
|
|
this.externalWindow.close();
|
||
|
|
} catch (e) { }
|
||
|
|
}, 20);
|
||
|
|
|
||
|
|
this.externalWindow.onbeforeunload = () => {
|
||
|
|
cookies.remove(`oauth-${this.props.type}`);
|
||
|
|
this.props.onClose();
|
||
|
|
clearInterval(this.codeCheck);
|
||
|
|
};
|
||
|
|
};
|
||
|
|
|
||
|
|
render() {
|
||
|
|
return <div onClick={this.createPopup}> {this.props.children} </div>;
|
||
|
|
}
|
||
|
|
|
||
|
|
componentWillUnmount() {
|
||
|
|
if (this.externalWindow) {
|
||
|
|
this.externalWindow.close();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|