Question

我完全被困住了，我确定这并没有我做的那么复杂。

我正在使用vue-authenticate库进行Instagram登录。

在我的 main.js 中，我拥有：

Vue.use(VueAuthenticate, {
  baseUrl: 'http://localhost:3000', // Your API domain
  providers: {
    instagram: {
      clientId: '******',
      redirectUri: 'http://localhost:8080/auth' // Your client app URL
    }
  }
})

在 store.js 里面，我有

import VueAxios from 'vue-axios'
import { VueAuthenticate } from 'vue-authenticate'
import axios from 'axios'

Vue.use(Vuex)
Vue.use(VueAxios, axios)

const vueAuth = new VueAuthenticate(Vue.prototype.$http, {
  baseUrl: 'http://localhost:3000'
})

这是我的组件：

<template>
  <div class="index columns">
    <button @click="authenticate('instagram')">Login with Instagram</button>
  </div>
</template>

<script>    
export default {
  name: 'Index',
  methods: {
    authenticate (provider) {
      this.$auth.authenticate(provider)
      .then((response) => {
        console.log(response)
      })
      .catch((error) => {
        console.log(error)
      })
    }
  }
}
</script>

当您单击按钮时，它将带您进入Instagram并进行身份验证。它到达了我在服务器上看到的我的Rails API端点。

但是，当它重定向回到我的Vue.js应用程序时，我只会遇到Error: Authentication failed at eval错误。

我对问题所在感到困惑。有没有人遇到这个问题，或者您能看到我的设置有问题吗？

vue.js中的vue-authenticate库抛出错误

0 个答案: