Skip to content

Instantly share code, notes, and snippets.

@gauravtiwari
Last active April 12, 2024 00:56
Show Gist options
  • Star 33 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save gauravtiwari/2ae9f44aee281c759fe5a66d5c2721a2 to your computer and use it in GitHub Desktop.
Save gauravtiwari/2ae9f44aee281c759fe5a66d5c2721a2 to your computer and use it in GitHub Desktop.
Promise based popup window for server oAuth
/* global window */
const popup = (url) => {
const windowArea = {
width: Math.floor(window.outerWidth * 0.8),
height: Math.floor(window.outerHeight * 0.5),
};
if (windowArea.width < 1000) { windowArea.width = 1000; }
if (windowArea.height < 630) { windowArea.height = 630; }
windowArea.left = Math.floor(window.screenX + ((window.outerWidth - windowArea.width) / 2));
windowArea.top = Math.floor(window.screenY + ((window.outerHeight - windowArea.height) / 8));
const sep = (url.indexOf('?') !== -1) ? '&' : '?';
const url = `${url}${sep}`;
const windowOpts = `toolbar=0,scrollbars=1,status=1,resizable=1,location=1,menuBar=0,
width=${windowArea.width},height=${windowArea.height},
left=${windowArea.left},top=${windowArea.top}`;
const authWindow = window.open(url, 'producthuntPopup', windowOpts);
// Create IE + others compatible event handler
const eventMethod = window.addEventListener ? 'addEventListener' : 'attachEvent';
const eventer = window[eventMethod];
const messageEvent = eventMethod === 'attachEvent' ? 'onmessage' : 'message';
// Listen to message from child window
const authPromise = new Promise((resolve, reject) => {
eventer(messageEvent, (e) => {
if (e.origin !== window.SITE_DOMAIN) {
authWindow.close();
reject('Not allowed');
}
if (e.data.auth) {
resolve(JSON.parse(e.data.auth));
authWindow.close();
} else {
authWindow.close();
reject('Unauthorised');
}
}, false);
});
return authPromise;
};
export default popup;
// On Server view after response
window.opener.postMessage(
{ auth: { token: access_token } },
window.opener.location
);
window.opener.postMessage(
{ error: 'Login failed' },
window.opener.location
);
@deadcoder0904
Copy link

deadcoder0904 commented Sep 27, 2021

@gauravtiwari do you know where do we write the Server view part in Next.js? I'm confused as there is no window on the backend :(

Edit: Found a solution. Had to send HTML back with script tag.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment