CODEWITHSUNDEEP
laravellaravel-5vuejs2axioslaravel-passport
rawk
rawk

Reputation: 508

Vue.js 2, Laravel 5.4, Passport, axios - API 'GET' Problems

I'm tying to get an API working with Vue.JS 2 and Laravel 5.4. In my App.vue I have the following code:

export default {
  name: 'app',
  components: {
    Hello
  },
  created () {
    const postData = {
      grant_type: 'password',
      client_id: 2,
      client_secret: 'somesecret',
      username: '[email protected]',
      password: 'password',
      scope: ''
      }
      this.$http.post('http://localhost:8000/oauth/token', postData)
        .then(response => {
           console.log(response)
           const header = {
             'Accept': 'application/json',
             'Authorization': 'Bearer ' + response.body.access_token
           }
           this.$http.get('http://localhost:8000/api/test', {headers: header})
             .then(response => {
               console.log(response)
             })
        })
   }
}

While 'POST' is working without any problems, I just can't get 'GET' working.

My console.log shows the following:

Uncaught (in promise) TypeError: Cannot read property 'access_token' 
of undefined at eval (eval at <anonymous> (app.js:810), <anonymous>:33:51)
(anonymous) @ App.vue?86c0:29

Unfortunately I couldn't find any explanation why this might be happening. Does anybody know if they changed 'access_token' to something else or why this is happening?

Hope someone knows :|

Thanks in advance!

Paul

Upvotes: 1

Views: 2736

Answers (2)

Safi Ahmed
Safi Ahmed

Reputation: 168

You can refer to the following link or you can compare with the below git repository

https://github.com/safiahmed4cs/Larave-Passport-with-Vue-Vue-Router-and-axios

which has Laravel App, Laravel Passport,

Axios, Vue Js, Vue Resource and Vue Router are imported as well,

Let me know if you required more info or if you face any issues.

Upvotes: 1

Ryan Fisher
Ryan Fisher

Reputation: 113

This is off the top of my head. But i'm sure if you are using axios as your XHR client your response body is under the 'data' parameter and not 'body'.

In summary your reference to access_token would be

'Authorization': 'Bearer ' + response.data.access_token

Upvotes: 3

Related Questions