We are facing a critical issue with Google Authentications in our Lightning Web Component (LWC) within the Mobile Publisher Community App. The specific error we are encountering is
{"error":"popup_blocked_by_browser"}.
This error is preventing users from completing the authentication process. We suspect that it may be related to popup blocking by certain browsers.
Below code working in desktop not working mobile app
Step 1:
// Load the Google Sign-In script
const script = document.createElement('script');
script.src = 'https://apis.google.com/js/platform.js';
//script.src = 'https://accounts.google.com/gsi/client';
script.async = true;
script.defer = true;
script.onload = () => this.initializeGoogleSignIn();
document.head.appendChild(script);
- // we call the gapi.load method.
gapi.load('auth2', function() {});
Step 2:
gapi.auth2.init({
client_id: '57975150250-6a4avq98onf6lvk026vhggg8vumh80iu.apps.googleusercontent.com', // Replace with your actual client ID
scope: 'openid profile email https://www.googleapis.com/auth/calendar https://www.googleapis.com/auth/calendar.events',
plugin_name:'login',
immediate: false,
prompt: 'consent',
cookiepolicy: 'single_host_origin',
fetch_basic_profile: true
}).then((authInstance) => {
console.log("gapi init in");
console.log(authInstance);
//var authIns = authInstance;
authInstance.signIn().then(googleUser => {
console.log('googleUser', JSON.stringify(googleUser));
this.showSuccessAlert("googleUser", ""+JSON.stringify(googleUser));
const profile = googleUser.getBasicProfile();
console.log('User ID:', profile.getId());
console.log('User Name:', profile.getName());
console.log('User Email:', profile.getEmail());
// Additional logic for Google Calendar integration
}).catch((error) => {
//console.error(error);
this.showFailureAlert("googleUser", ""+JSON.stringify(error));
});
});