Using fetch to PUT data to a Laravel API that uses Laravel Sanctum. Sending the `X-XSRF-TOKEN` token to avoid error "CSRF token mismatch" with Laravel Sanctum

api.js

//https://stackoverflow.com/a/56071867/1469799
export const getAllCookies = () => document.cookie.split(';').reduce((ac, str) => Object.assign(ac, {[str.split('=')[0].trim()]: str.split('=')[1]}), {});

export const getCookie(name, defaultValue = null) => {
  let cookies = getAllCookies();
  return cookies.hasOwnProperty(name) ? cookies[name] : defaultValue;
}
fetch('/api/v1/rocks, {
        method: "PUT",
        body: JSON.stringify({
          color: "red"
          shiny: true
        }),
        credentials: 'include',
        headers: {
            "Content-Type": "application/json",
            "X-XSRF-TOKEN": token,
            "Accept": "application/json"
        },

    })
    .then( r => r.json() )
    .then( r => {
      console.log(r);
    });

see.md

• https://stackoverflow.com/questions/61063479/csrf-token-mismatch-laravel-sanctum-and-angular-http
• https://laravel.com/docs/9.x/sanctum#spa-authenticating