title: 419 CSRF Token Mismatch after logging out and logging back in
body: <p>After I log out and want to log back in I get the following error:</p>
  
  <blockquote>
    <p>message: "CSRF token mismatch.", exception:
    "Symfony\Component\HttpKernel\Exception\HttpException"</p>
  </blockquote>
  
  <p>I customized some parts of the <code>LoginController</code> so it might have something to do with that. I tried searching in the unmodified <code>LoginController</code> but I can't find anything. My login function from my <code>vuex</code> store:</p>
  
  <pre><code>login({ commit }, user) {
      return new Promise((resolve, reject) =&gt; {
          axios({ url: '/login', data: user, method: 'POST' })
              .then(response =&gt; {
                  const user = response.data.user
                  commit('auth_success', user)
                  resolve(response)
              })
              .catch(error =&gt; {
                  commit('auth_error')
                  reject(error)
              })
      })
  },
  </code></pre>
  
  <p>My logout function, also from my <code>vuex</code> store:</p>
  
  <pre><code>logout({ commit }) {
      return new Promise((resolve, reject) =&gt; {
          axios({ url: '/logout', method: 'POST' })
              .then(() =&gt; {
                  commit('logout')
                  localStorage.removeItem('user');
                  resolve()
              })
              .catch(error =&gt; {
                  reject(error)
              })
      })
  },
  </code></pre>
  
  <p>And this is my LoginController:</p>
  
  <pre><code>&lt;?php
  
  namespace App\Http\Controllers\Auth;
  
  use App\Http\Controllers\Controller;
  use App\Providers\RouteServiceProvider;
  use Illuminate\Foundation\Auth\AuthenticatesUsers;
  use Illuminate\Http\Request;
  use Illuminate\Support\Facades\Auth;
  
  class LoginController extends Controller
  {
  
      use AuthenticatesUsers;
  
      protected $redirectTo = RouteServiceProvider::HOME;    
  
      public function __construct()
      {
          $this-&gt;middleware('guest')-&gt;except('logout');
      }
  
      public function login(Request $request)
      {
  
          if ($this-&gt;attemptLogin($request)) {
  
              $request-&gt;session()-&gt;regenerate();
  
              return $this-&gt;authenticated($request, $this-&gt;guard()-&gt;user());
          }
      }
  
      protected function attemptLogin(Request $request)
      {
          return $this-&gt;guard()-&gt;attempt(['email' =&gt; $request-&gt;json('email'), 'password' =&gt; $request-&gt;json('password')]);
      }
  
      protected function authenticated(Request $request, $user)
      {
          if ($user) {
              return response()-&gt;json([
                  'user' =&gt; $user
              ], 200);
          } else {
              return response('', 400);
          }
      }
  
      public function logout(Request $request)
      {
          $this-&gt;guard()-&gt;logout();
  
          if ($request-&gt;session()-&gt;invalidate()) {
              return response('', 200);
          }
      }
  }
  </code></pre>
  
  <p>Am I missing something? </p>
  
  <p><strong>Update:</strong>
  If I do a page refresh, I don't get the error anymore. This has probably something to do with that I have a Single Page Application using <code>vue-router</code>. So I guess I need a page refresh to avoid the 419 error. But this is not an ideal situation. Does someone has experience with this?</p>