सिम्फनी 2 एफओएस उपयोगकर्ता बंडल बूटस्ट्रैप मोडल AJAX लॉगिन

Question

क्या किसी ने सिम्फनी 2 और एफओएस उपयोगकर्ता बंडल के साथ बूटस्ट्रैप मोडल के अंदर पहले ही लॉगिन फॉर्म बनाया है?

यहाँ मैं अब है:

src/Webibli/UserBundle/संसाधन/config/service.yml

authentication_handler: 
    class:  Webibli\UserBundle\Handler\AuthenticationHandler 
    arguments: [@router, @security.context, @fos_user.user_manager, @service_container] 

एप्लिकेशन/config/security.yml

form_login: 
    provider: fos_userbundle 
    success_handler: authentication_handler 
    failure_handler: authentication_handler 

src/Webibli/UserBundle/हैंडलर/प्रमाणीकरण हैंडलर.पीपी

<?php 

namespace Webibli\UserBundle\Handler; 

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


class AuthenticationHandler implements AuthenticationSuccessHandlerInterface, AuthenticationFailureHandlerInterface 
{ 

    protected $router; 
    protected $security; 
    protected $userManager; 
    protected $service_container; 

    public function __construct(RouterInterface $router, SecurityContext $security, $userManager, $service_container) 
    { 
     $this->router = $router; 
     $this->security = $security; 
     $this->userManager = $userManager; 
     $this->service_container = $service_container; 

    } 
    public function onAuthenticationSuccess(Request $request, TokenInterface $token) { 
     if ($request->isXmlHttpRequest()) { 
      $result = array('success' => true); 
      $response = new Response(json_encode($result)); 
      $response->headers->set('Content-Type', 'application/json'); 
      return $response; 
     } 
     else { 
      // Create a flash message with the authentication error message 
      $request->getSession()->getFlashBag()->set('error', $exception->getMessage()); 
      $url = $this->router->generate('fos_user_security_login'); 

      return new RedirectResponse($url); 
     } 

     return new RedirectResponse($this->router->generate('anag_new')); 
    } 
    public function onAuthenticationFailure(Request $request, AuthenticationException $exception) { 

     if ($request->isXmlHttpRequest()) { 
      $result = array('success' => false, 'message' => $exception->getMessage()); 
      $response = new Response(json_encode($result)); 
      $response->headers->set('Content-Type', 'application/json'); 
      return $response; 
     } 
     return new Response(); 
    } 
} 

और यहाँ टहनी दृश्य मैं अपने बूटस्ट्रैप मोडल में लोड कर रहा हूँ:

{% extends 'UserBundle::layout.html.twig' %} 
{% trans_default_domain 'FOSUserBundle' %} 
{% block user_content %} 
<script> 
    $('#_submit').click(function(e){ 
     e.preventDefault(); 
     $.ajax({ 
      type  : $('form').attr('method'), 
      url   : $('form').attr('action'), 
      data  : $('form').serialize(), 
      success  : function(data, status, object) { 
       console.log(status); 
       console.log(object.responseText); 
      } 
    }); 
}); 
</script> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <form action="{{ path("fos_user_security_check") }}" method="post" role="form" data-async data-target="#rating-modal" class="text-left"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">{{ 'layout.login'|trans }}</h4> 
     </div> 
     <div class="modal-body"> 
      {% if error %} 
       <div>{{ error|trans }}</div> 
      {% endif %} 
      <input type="hidden" name="_csrf_token" value="{{ csrf_token }}" /> 
      <div class="form-group container"> 
       <label for="email">{{ 'security.login.username_email'|trans }}</label> 
       <input type="text" class="form-control" id="username" name="_username" value="{{ last_username }}" required="required" placeholder="adresse@email.com"> 
      </div> 
      <div class="form-group container"> 
       <label for="password">{{ 'security.login.password'|trans }}</label><br /> 
       <input type="password" id="password" name="_password" required="required" class="form-control" placeholder="********"> 
      </div> 
      <div class="form-group container"> 
       <label for="remember_me"> 
        <input type="checkbox" id="remember_me" name="_remember_me" value="on" /> 
        {{ 'security.login.remember_me'|trans }} 
       </label> 
      </div> 
     </div> 
     <div class="modal-footer"> 
      <input type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans }}" class="btn btn-primary"> 
     </div> 
    </form> 
</div> 
</div> 
{% endblock %} 

लॉगिन प्रपत्र AJAX के बिना बिल्कुल ठीक काम कर रहा है। यदि कोई समस्या है तो मैं मोडल में अपने फॉर्म पर त्रुटि प्राप्त करने की कोशिश कर रहा हूं, या लॉगिन सफल होने पर उपयोगकर्ता को रीडायरेक्ट कर रहा हूं।

क्या कोई इसे समझा सकता है कि इसे कैसे प्राप्त किया जाए?

Answer 1

मैं समाधान पाया है:

$('#_submit').click(function(e){ 
     e.preventDefault(); 
     $.ajax({ 
      type  : $('form').attr('method'), 
      url   : $('form').attr('action'), 
      data  : $('form').serialize(), 
      success  : function(data, status, object) { 
       if (data.sucess == false) { 
        $('.modal-body').prepend('<div />').html(data.message); 
       } else { 
        window.location.href = data.targetUrl; 
       } 
      } 
    }); 

आप भी अपनी onAuthenticationSuccess-विधि के isXmlHttpRequest-हिस्से को संशोधित करने की है। इधर,

<script> 
    $(document).ready(function(){ 
     $('#_submit').click(function(e){ 
      e.preventDefault(); 
      $.ajax({ 
       type  : $('form').attr('method'), 
       url   : '{{ path("fos_user_security_check") }}', 
       data  : $('form').serialize(), 
       dataType : "json", 
       success  : function(data, status, object) { 
        if(data.error) $('.error').html(data.message); 
       }, 
       error: function(data, status, object){ 
        console.log(data.message); 
       } 
      }); 
     }); 
    }); 
</script> 

यहाँ, क्या मैं अपने जावास्क्रिप्ट को जोड़ा गया है और मेरे हैंडलर से मेरी onAuthenticationFailure विधि है

public function onAuthenticationFailure(Request $request, AuthenticationException $exception) { 
    $result = array(
     'success' => false, 
     'function' => 'onAuthenticationFailure', 
     'error' => true, 
     'message' => $this->translator->trans($exception->getMessage(), array(), 'FOSUserBundle') 
    ); 
    $response = new Response(json_encode($result)); 
    $response->headers->set('Content-Type', 'application/json'); 

    return $response; 
} 

मुझे लगता है कि यह मेरे अजाक्स विधि है कि गलत था से URL था। आपकी सलाह के लिए धन्यवाद।

Answer 2

मुझे लगता है कि आप जो खोज रहे हैं वह यह है: Symfony2 ajax login।

आपकी जावास्क्रिप्ट sth देखेंगे। इस तरह:

[...] 
if ($request->isXmlHttpRequest()) { 
      $targetUrl = $request->getSession()->get('_security.target_path'); 
      $result = array('success' => true, 'targetUrl' => targetUrl); 
      $response = new Response(json_encode($result)); 
      $response->headers->set('Content-Type', 'application/json'); 
      return $response; 
     } 
[...]