[FIXED] Symfony 5 Login form action return Invalid CSRF token

Issue

I'm using security component of symfony 5 to create authentication system, I used make:auth of symfony cli and I enabled login after register form, when logout and trying to login with login form it return Invalid CSRF token error !

this is my login form twig :

{% extends 'base.html.twig' %}

{% block title %}Log in!{% endblock %}

{% block body %}


<div class="container">
    <br>

    <div class="row justify-content-center" >

<form method="post">
    {% if error %}
        <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
    {% endif %}

    {% if app.user %}
        <div class="mb-3">
            You are logged in as {{ app.user.username }}, <a href="{{ path('app_logout') }}">Logout</a>
        </div>
    {% endif %}

    <div class="card">
        <article class="card-body">
            <a href="{{ path('app_register') }}" class="float-right btn btn-outline-primary">S'inscrire</a>
            <h4 class="card-title mb-4 mt-1">Connection</h4>
            <p>
                <a href="" class="btn btn-block btn-outline-info"> <i class="fab fa-twitter"></i>   Login via Twitter</a>
                <a href="" class="btn btn-block btn-outline-primary"> <i class="fab fa-facebook-f"></i>   Login via facebook</a>
            </p>
            <hr>
            <form>
                <div class="form-group">
                    <input type="email" value="{{ last_username }}" name="email" id="inputEmail" class="form-control" required autofocus>
                </div> <!-- form-group// -->
                <div class="form-group">
                    <input type="password" name="password" id="inputPassword" class="form-control" required>
                </div> <!-- form-group// -->
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <button type="submit" class="btn btn-primary btn-block"> Login  </button>
                        </div> <!-- form-group// -->
                    </div>

                </div> <!-- .row// -->
                <div class="row">
                    <div class="col-md-12 mt-5">
                        <a href="{{ path('app_forgot_password_request') }}" class="small">Mot de passe oubliée</a>
                    </div>
                </div>
                <div class="checkbox mb-3">
                    <label>
                        <input type="checkbox" name="_remember_me"> Remember me
                    </label>
                </div>
            </form>
        </article>
    </div>
</form>
    </div>
</div>
{% endblock %}

---

/**
     * @Route("/login", name="app_login")
     * @param AuthenticationUtils $authenticationUtils
     * @return Response
     */
    public function login(AuthenticationUtils $authenticationUtils): Response
    {
        // if ($this->getUser()) {
        //     return $this->redirectToRoute('target_path');
        // }

        // get the login error if there is one
        $error = $authenticationUtils->getLastAuthenticationError();
        // last username entered by the user
        $lastUsername = $authenticationUtils->getLastUsername();

        return $this->render('security/login.html.twig', ['last_username' => $lastUsername, 'error' => $error]);
    }

I don't understand how login system work directly after register form but it doesn't on login action

Solution

In security.yml:

config/packages/security.yaml security: # ...

firewalls:
    secured_area:
        # ...
        form_login:
            # ...
            csrf_token_generator: security.csrf.token_manager

And try to add in end of your form

   <input type="hidden" name="_csrf_token" value="{{ 
    csrf_token('authenticate') }}">

Answered By - dev_2020