Error with adding Google SSO to mobile application Answered

Post author
Juan Andrés Baz

Hi Tyler Bell

We are trying to add Google SSO to our mobile application using memberstack, but looks like it send the user data to the opener tab here

using this script

const error = JSON.parse('{"message":"Something went wrong. Please try again."}');
if (error) {
window.opener.postMessage({ error }, "*");
} else {
const data = JSON.parse(unescape('[object Object]'))
window.opener.postMessage({ data }, "*");

Is there any chances to don’t open a new tab and send the data to a parent mobile application?

For example:
window.ReactNativeWebView.postMessage for React Native, and
window.webkit.messageHandlers.cordova_iab.postMessage for Cordova

Thanks in advance


1 comment

  • Comment author
    Juan Andrés Baz

    I resolved this by making modifications to the memberstack/dom lib

    • We got the memberstack url that is using to open the sso tab with our params
    • We opened an in-app browser using the URL from the step 1
    • Create a listener onMessage (React Native) or loadstop (Capacitor + cordova) to check the url redirects
    • If the url redirects is then Google SSO is done and the user is redirected to the callback
    • Inject a javascript to the in-app browser to get the html and send it to the app parent
    • Capacitor: "window.webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify({message: window.document.documentElement.innerHTML}));"
    • ReactNative: 'window.ReactNativeWebView.postMessage(JSON.stringify(window.document.documentElement.innerHTML))'
    • Create a browser listener to get that message and parse the html to get the success (token) or error (error message)


    const getSuccessMessage = (message) => { try { const regex = new RegExp(/unescape\('([^']+)'\)/); if (regex.test(message)) { const match = regex.exec(message); const extractedString = match[1]; const encodedString = extractedString .replace('"unescape(', "") .replace('"', ""); const unscapeString = unescape(encodedString); const parsedString = JSON.parse(unscapeString); return parsedString; } } catch (error) { return null; } };


    const getErrorMessage = (message) => { try { const regex = new RegExp(/"message":"([^"]*)"/); if (regex.test(message)) { const match = regex.exec(message); const extractedString = match[1]; return extractedString; } } catch (error) { return null; } };
    • If it was success we save the token in the cookie or localstorage, and if it was an error we show it to the user

    That's all, hope this helps


Please sign in to leave a comment.