I'm writing Vue js app.
In index html file I include in the head tag the following:
<meta name="google-signin-client_id" content="<my_client_id>.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
When I've written Login component, I've used the following code (this link helped me) to implement sign in button:
template: `
...
<div id="google-signin-button"></div>
...
`
methods: {
...
onSignIn (user) {
const profile = user.getBasicProfile();
this.login(profile);
}
...
}
mounted() {
...
gapi.signin2.render('google-signin-button', {
onsuccess: this.onSignIn
})
...
},
And it worked. Now I;ve tried to use the following code in Navbar component (which is a part of other components after redirection) to implement signout, but I get "TypeError: Cannot read properties of undefined (reading 'getAuthInstance')":
logout: function () {
var self = this;
if(confirm("Вы действительно хотите выйти?")) {
const auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('user signed out');
self.$store.dispatch('authentication/logout')
.then(() => {
self.$router.push('/login')
})
});
}
},
I tried the answer from this link, but I get cookie policy error and don't know what to do about it. May be there is another way? Please, help! And correct my grammar errors if you please. Thank you!