Laravel Airlock - CSRF token mismatch

Question

I've been trying to get Laravel Airlock to work with a new web app I'm developing but no matter what I try, I can't get it to work.

airlock.php has the following set:

'stateful' => ['https://control.domain.tld',
               'https://management.domain.tld',
               'localhost'],

cors.php has:

'paths' => ['api/*', 'login', 'airlock/csrf-cookie'],
'supports_credentials' => true,

My .env has:

SESSION_DRIVER=cookie

session.php has:

'domain' => env('SESSION_DOMAIN', null),

In my Vue app I'm running this Axios request but I keep getting CSRF token mismatch.

axios.get('https://controlapi-v2.domain.tld/airlock/csrf-cookie').then(response => {
   console.log(response);
});

I've followed all the guides online with zero luck. What could I be missing here?

The stateful variable in airlock.php has 3 URL's as my app will be on 2 domains and on localhost for development and testing. I've only tried this on localhost at the moment and am wondering whether this is causing the issue.

If I change localhost to http://localhost I no longer get CSRF token mismatch but there's when I check Chrome dev tools, there's no cookie set.

I've also read that the SPA has to be on the same subdomain as the API for Airlock to work. Is this true?

Which version of Laravel are you on 6.x or 7.x? – ahinkle Mar 04 '20 at 20:30 — ahinkle, Mar 04 '20 at 20:30
@hinteractive02 - 7.0, just installed it yesterday. – Dally Mar 04 '20 at 21:53 — Dally, Mar 04 '20 at 21:53

score 2 · Answer 1 · answered Mar 14 '20 at 15:00

After some days searching solution, its works with me.

import Cookies from 'js-cookie'
import axios from 'axios'

axios.defaults.withCredentials = true

axios.get('http://localhost:8000/airlock/csrf-cookie')
   .then(response => {
       Cookies.set("X-XSRF-TOKEN", Cookies.get("XSRF-TOKEN"))
       // Login...
       axios.post('http://localhost:8000/login', {
         email: 'admin@admin.com',
         password: '@admin123'
       }).then((data) => {
         console.log(data);
       })
    });

or

<?php 
namespace App\Http\Middleware; 
use Closure; 

class TransformApiHeaders  { 

    public function handle($request, Closure $next) {

        $cookie_name = 'XSRF-TOKEN'; 
        $token_cookie = $request->cookie($cookie_name); 

        if ($token_cookie !== null) { 
            $request->headers->add(["X-$cookie_name" => $token_cookie]); 
        }

        return $next($request); 
    }
}

in Kernel.php

protected $middleware = [
   TransformApiHeaders::class,
   // ...
];

Laravel Airlock - CSRF token mismatch

1 Answers1