I am using Symfony 2.3 with FOSUserBundle and want to make a login form with AJAX. I found a view questions on SO (like [this one](https://stackoverflow.com/questions/28678307/fosuserbundle-ajax-login-with-symfony2-routing)) and even some other helpful sites ([Adding an AJAX Login Form to a Symfony Project](http://www.webtipblog.com/adding-an-ajax-login-form-to-a-symfony-project/)) that explained, how to use FOSUserBundle with ajax.

Everything works fine when I submit the form regularly, but using the ajax call I keep getting the message "Invalid CSRF token.".

Here are my configurations:

The Custom AuthenticationHandler:

```
namespace Moodio\Bundle\UserBundle\Handler;

use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpFoundation\RedirectResponse;
use Symfony\Component\Routing\RouterInterface;
use Symfony\Component\HttpFoundation\Session\Session;
use Symfony\Component\Security\Core\Authentication\Token\TokenInterface;
use Symfony\Component\Security\Core\Exception\AuthenticationException;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Security\Core\SecurityContextInterface;
use Symfony\Component\Security\Http\Authentication\AuthenticationSuccessHandlerInterface;
use Symfony\Component\Security\Http\Authentication\AuthenticationFailureHandlerInterface;

class AuthenticationHandler implements AuthenticationSuccessHandlerInterface, AuthenticationFailureHandlerInterface
{
    private $router;
    private $session;
    private $translator;
    private $csrf_provider;

    /**
     * Constructor
     */
    public function __construct( RouterInterface $router, Session $session, $translator, $csrf_provider )
    {
        $this->router  = $router;
        $this->session = $session;
        $this->translator = $translator;
        $this->csrf_provider = $csrf_provider;
    }

    /**
     * onAuthenticationSuccess
     */
    public function onAuthenticationSuccess( Request $request, TokenInterface $token )
    {
        // if AJAX login
        if ( $request->isXmlHttpRequest() ) {
            $array = array( 'success' => true); // data to return via JSON
            $response = new Response( json_encode( $array ) );
            $response->headers->set( 'Content-Type', 'application/json' );
            return $response;

        } else {// if form login

            return parent::onAuthenticationSuccess($request, $token);
        }
    }

    /**
     * onAuthenticationFailure
     *
     */
    public function onAuthenticationFailure( Request $request, AuthenticationException $exception )
    {
        // if AJAX login
        if ( $request->isXmlHttpRequest() ) {
            $result = array(
                'success' => false,
                'message' => $this->translator->trans($exception->getMessage(), array(), 'FOSUserBundle')
            ); // data to return via JSON

            $response = new Response( json_encode( $result ) );
            $response->headers->set( 'Content-Type', 'application/json' );

            return $response;

        } else {// if form login

            // set authentication exception to session
            $request->getSession()->set(SecurityContextInterface::AUTHENTICATION_ERROR, $exception);

            return new RedirectResponse( $this->router->generate( 'fos_user_security_login' ) );
        }
    }
}

```

src/Moodio/Bundle/MainBundle/services.yml:

```
services:
    moodio_main.security.authentication_handler:
        class: Moodio\Bundle\UserBundle\Handler\AuthenticationHandler
        public: false
        arguments:
            - @router
            - @session
            - @translator
            - @form.csrf_provider

```

security.yml firewalls:

```
    main:
        pattern: ^/
        form_login:
            provider: fos_userbundle
            csrf_provider: form.csrf_provider
            success_handler: moodio_main.security.authentication_handler
            failure_handler: moodio_main.security.authentication_handler
        logout:       true
        anonymous:    true

```

my javascript

```
$('#_submit').click(function(e){
    e.preventDefault();
    var frm = $('form');
    $.ajax({
        type        : frm.attr('method'),
        url         : frm.attr('action'),
        data        : frm.serialize(),
        success     : function(data, status, object) {
            if(data.error) $('.error').html(data.message);
        },
        error: function(data, status, object){
            console.log(data.message);
        }
    });
});

```

I tried some answers like in [this answer](https://stackoverflow.com/a/11632713), but it did not work for me. I actually don't understand why it should make a difference, because FOSUserBundle already creates the csrf-token and includes it in the twig template with {{ csrf\_token }}.

At the moment I am using the standard FOSUserBundle templates (and only added the view lines of js I needed for the ajax).

One thing I also tried just to see if the csrf validation works, is to generate the csrf token in the onAuthenticationFailure function and check if it is valid just in the next line. In this case isCsrfTokenValid() returned true.

When I deactivate the csrf\_provider in the firewall (in security.yml) I always get the message "Bad credentials" even though the credentials are right.