Access token to API works in postman but not when calling from Vue

Help
1

Hi,

I have 2 items in Auth0:

  1. Application - SPA app
  2. API - Custom API, machine to machine

I have followed the instruction in the link below to call my custom API:
https://auth0.com/docs/quickstart/spa/vuejs/02-calling-an-api

I have downloaded the sample with settings for both items mentioned above. The vue app login correctly and are able to call the external API by using the downloaded codes.

However, when I change the backend to my laravel/lumen app which already set up for item no.2 (custom API), the vue app received 401 unauthorized error. So I copied the access token retrieved through vue:

const accessToken = await this.$auth.getTokenSilently();

console.log(accessToken);

And try to call my lumen app with this access token - it works perfectly fine! Is there a setting somewhere to enable vue & my lumen app to work with auth0? Please advise. Thanks

p/s: The custom lumen API was made following the instruction from link below:
https://auth0.com/blog/developing-restful-apis-with-lumen/

3

Hi @faizalec,

Welcome to the Auth0 Community Forum!

Is the laravel app registered and allowed access to the API in the auth0 dashboard? If you go to the api in the dash and see M2M connections you should be able to toggle the apps.

Let me know.

Thanks,
Dan

1 Like
4

Hi Dan,

If by registered you mean the Auth0 configurations for the laravel app are set with the API config, then yes. Anyway, by further investigation I found out that the Vue app was not sending the Authorization header to my laravel app. However, it did send to the express backend (from the example codes). You can close this for now, I’ll open a new topic if anything else comes up related to Auth0.

Thanks!

5

@faizalec,

Sounds good, thanks for the update!