Я использую vue-authenticate для входа в социальную сеть для Google.
Я выполнил базовую настройку, как указано в readme для vue-authenticate gituhub.Ниже приведен код моего файла vue
<template>
<button @click="authenticate('google')">auth Google</button>
</template>
<script>
export default {
name: 'app',
methods: {
authenticate: function (provider) {
this.$auth.authenticate(provider).then(function () {
})
}
}
}
</script>
Мой файл js, в котором я определяю провайдера, выглядит следующим образом
import Vue from 'vue'
import App from './App.vue'
import VueAxios from 'vue-axios'
import VueAuthenticate from 'vue-authenticate'
import axios from 'axios';
Vue.use(VueAxios, axios)
Vue.use(VueAuthenticate, {
baseUrl: 'http://localhost:8000', // Your API domain
storageType: 'localStorage',
tokenName: 'token',
providers: {
google: {
clientId: 'client_id_key',
redirectUri: 'http://localhost:8080/',
url: 'http://localhost:8000/rest-auth/google/',
}
}
})
new Vue({
el: '#app',
render: h => h(App),
})
Мой взгляд на серверную часть для аутентификаций Google выглядит следующим образом
class GoogleLogin(SocialLoginView):
adapter_class = GoogleOAuth2Adapter
callback_url = 'http://localhost:8080/'
client_class = OAuth2Client
Теперь, когда я нажимаю кнопку на веб-интерфейсе, появляется окно, все записи в моей базе данных создаются, как и ожидалось, и пользователь создается так, как я хочу, на серверной стороне.
Однако на веб-интерфейсе я получаю сообщение об ошибке на консоли:
Возможное необработанное отклонение обещания: ошибка: аутентификация не удалась при eval (vue-authenticate.es2015.js? 5ab3: 1380)
Что я делаю не так?Кажется, я не могу понять.
Я использую django-rest-auth и vue-authenticate.