Method for setting CSRF token on client about precognition

[timacdonald]

@jasonvarga sorry I didn't see your issue here.

Sounds like you have it solved, but for anyone seeing this I would also recommend doing this globally somewhere via the Axios client configuration...

import { client } from 'laravel-precognition-{package_flavour}';

getCsrfToken().then(csrfToken => {
    client.axios().defaults.headers.common['X-CSRF-TOKEN'] = csrfToken;
})

[timacdonald]

Gotcha! Another option which might feel a little cleaner is to set the _token input on the form, either by injecting a hidden HTML input into the form like @csrf does or adding it in the form data. This would require the the-element to be available on load.

$form('post', '/the-url', {
    _token: document.getElementById('the-element').value,
});

Either way, a few options depending on what you need.

[jasonvarga]

Someone found a solution for us that seems to work.

In the custom event I mentioned, we would update the token on an html element.

Then we can provide an object with a toString method to the header, which will grab the token from the element.

$form('post', '/the-url', {}, {
  headers: {
    'X-CSRF-Token': {
      toString: () => document.getElementById('the-element').value
    }
  }
});

[jasonvarga]

Thanks Tim.

In our case, we are injecting some JS into the html response via a package. We don't have access to their JS build process so we can't import { client } but this is good to know anyway!