Javascript vue.js中的vue-google-oauth-2存在问题
我正在尝试将Google登录按钮添加到我的Vue.js应用程序中,我找到了Vue-Google-oauth2插件。我安装了它,并严格按照sample.html代码将其集成到我的应用程序中,方法如下:Javascript vue.js中的vue-google-oauth-2存在问题,javascript,vue.js,google-authentication,Javascript,Vue.js,Google Authentication,我正在尝试将Google登录按钮添加到我的Vue.js应用程序中,我找到了Vue-Google-oauth2插件。我安装了它,并严格按照sample.html代码将其集成到我的应用程序中,方法如下: <template> <div> <h1>Test</h1> <button @click="handleClickSignIn" :disabled="!isLoaded">signIn</button>
<template>
<div>
<h1>Test</h1>
<button @click="handleClickSignIn" :disabled="!isLoaded">signIn</button>
</div>
</template>
<script>
/**
* You should first need to place these 2 lines of code in your APP ENTRY file, e.g. src/main.js
*
* import GAuth from 'vue-google-oauth2'
* Vue.use(GAuth, {clientId: '4584XXXXXXXX-2gqknkvdjfkdfkvb8uja2k65sldsms7qo9.apps.googleusercontent.com'})
*
*/
export default {
name: 'test',
props: [],
components: {
},
data () {
return {
isLoaded: false
}
},
computed: {
},
methods: {
handleClickSignIn(){
this.$gAuth.signIn(function (user) {
//on success do something
console.log('user', user)
}, function (error) {
//on fail do something
})
}
},
mounted(){
let that = this
let checkGauthLoad = setInterval(function(){
that.isLoaded = that.$gAuth.isLoaded()
console.log('checked', that.isLoaded)
if(that.isLoaded) clearInterval(checkGauthLoad)
}, 1000);
}
}
</script>
问题是isLoaded方法永远不会返回true,每次我按下按钮时,Google Chrome控制台都会告诉我Google api尚未就绪,这就是当GoogleAuthInstance为false时打印的插件控制台消息。有人能帮我吗?使用isInit而不是ISLOAD,因为后者将被弃用。添加到main.js
import GAuth from 'vue-google-oauth2'
Vue.use(GAuth, {
clientId: '....apps.googleusercontent.com',
scope: 'email',
prompt: 'consent',
fetch_basic_profile: true
})
new Vue({
...
render: (h) => h(App),
}).$mount("#app");
你的index.js/main.js看起来怎么样?你初始化谷歌认证了吗?你看了吗?你要我做的事我都做了。我在main.js中为项目中的Google Auth初始化添加了两行代码,并完成了README.md文件中的所有步骤。