loading...

Discussion on: PKCE authenticaton for Nuxt SPA with Laravel as backend

stefant123 profile image
StefanT123 Author

You need to send Bearer header with every request

Thread Thread
thorbn profile image
Thor

Do you have an example?

I'm trying with this but I cant get the token

async asyncData({ $axios }) {

async asyncData (context) {
const trials = await $axios.$get(process.env.LARAVEL_ENDPOINT + "/api/trials/", {}, { headers: {"Authorization" : Bearer ${context.app.$auth.getToken('local')}} })

I can se the cookie x-access-token in chrome developer tool under application

Thread Thread
thorbn profile image
Thor

Now I got the access_token:
const access_token = cookies.get('x-access-token');
console.log(access_token);

    const trials = await $axios.$get(process.env.LARAVEL_ENDPOINT + "/api/trials/", {}, { headers: {"Authorization" : `Bearer ${access_token}`} });

But still no content, only errors:

Access to XMLHttpRequest at 'domain.com/api/trials/' from origin 'app.domain.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.
cf5ce039ccd82a3e879b.js:1 GET domain.com/api/trials/ net::ERR_FAILED


Request URL: domain.com/api/trials/
Referrer Policy: no-referrer-when-downgrade
Provisional headers are shown

Thread Thread
stefant123 profile image
StefanT123 Author

You should do something like this this.$axios.setToken(access_token, token_type);

Thread Thread
thorbn profile image
Thor

Hi again,

Now I need to "update a Post" and the error comes again, but only on the domain not local:


Console error:
Access to XMLHttpRequest at 'domain.com/api/trials/' from origin 'app.domain.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.
600bbbde120028ba59aa.js:1 POST domain.com/api/trials/ net::ERR_FAILED


Laravel log error:
[2020-06-22 16:05:59] local.ERROR: The resource owner or authorization server denied the request. {"exception":"object
[stacktrace].....\TokenGuard.php(149): Laravel\Passport\Guards\TokenGuard->getPsrRequestViaBearerToken


My update submit:

UpdateForm(key) {
event.preventDefault();
var app = this;

    const access_token = cookies.get('x-access-token');
    this.$axios.setToken(access_token, 'Bearer')
    this.$axios.setHeader('Content-Type', 'application/json', [
      'post'
    ])

    this.$axios.$post(process.env.LARAVEL_ENDPOINT+'/api/trials', {
        this.editedItem.employees_dates[key],
        date: this.editedItem.key,
      }
      )
      .then(resp => {
        app.$router.push({ path: "/datetrialupdate" });

      })
      .catch(error => {

        alert("error");
      });
  },
Thread Thread
stefant123 profile image
StefanT123 Author

You need to setup the correct domain for the CORS

Thread Thread
thorbn profile image
Thor

But it works for GET (posts) and get users but not update content (post)

Thread Thread
stefant123 profile image
StefanT123 Author

See if the post request has been enabled for CORS

Thread Thread
thorbn profile image
Thor

how can I see that? i'm new to cors, its hard to debug when it works local but not on the server

Thread Thread
stefant123 profile image
StefanT123 Author

Read the documentation for fruitcake/laravel-cors

Thread Thread
thorbn profile image
Thor

When I read the docs I can't find info on what to change to get post to work . Do you know where to se an example on a Update with "post" have been used, with Nuxt/Passport? almost all examples are just GET

Thread Thread
thorbn profile image
Thor

Now it works. :)

My post looks like:

    const access_token = cookies.get('x-access-token');
    this.$axios.setToken(access_token, 'Bearer')

    this.$axios.setHeader('Content-Type', 'application/json', [
      'post'
    ])

    this.$axios
      .$post(process.env.LARAVEL_ENDPOINT + "/api/trials", {

        grant_type: 'authorization_code',
        client_id: 1,
        ..................

I also removed a / from /api/trials (is was /api/trials/)

I will try later to remove some of the code to see if it all have to be there.