Biểu mẫu Symfony2 có CSRF được chuyển qua JQuery AJAX

Question

Tôi đang phát triển một hộp nhận xét sẽ lưu nhận xét thông qua cuộc gọi JAX AJAX.

JQuery

Dưới đây là mã JQuery cho rằng (chỉ hoạt động này liên tục):

$(".post-comment").click(function() { 
    var $form = $(this).closest("form"); 

    if($form) 
    { 
     $.ajax({ 
      type: "POST", 
      url: Routing.generate('discussion_create'), 
      data: $form.serialize(), 
      cache: false, 
      success: function(html){ 
       alert("Success!"); 
       // Output something     
      } 
     }); 
    } 
    else 
    { 
     alert("An error occured"); 
    } 
    return false; 
}); 

Symfony2 khiển

Các Symfony2 phương pháp điều khiển sau đó chọn lên các dữ liệu mẫu và quy trình nó. Là một phần của quá trình đó, séc sẽ kiểm tra xem biểu mẫu có hợp lệ không:

$entry = new Discussion(); 
$discussionForm = $this->createForm(new DiscussionType(), $entry); 

if ($request->getMethod() == 'POST') { 

    $discussionForm->bindRequest($request); 

    if ($discussionForm->isValid()) { 

Séc này không trả về đúng. Trong trường hợp khác, tôi trích xuất các thông báo lỗi đã được đưa ra và nhận được:

Array 
(
    [0] => The CSRF token is invalid. Please try to resubmit the form 
) 

Mã thông báo CSRF đang được chuyển qua bài như thể nó sẽ được gửi đồng bộ.

Một vấn đề có thể .. Unique Mẫu Id của

Dạng Tôi đang sử dụng được tạo ra bởi một lớp kiểu mẫu. Trên bất kỳ trang nào, sẽ có một số biểu mẫu nhận xét. Vì symfony2 sử dụng phương thức getName() của lớp kiểu để điền thuộc tính ID biểu mẫu, tôi đã sửa đổi nó như sau:

public function getName() 
{ 
    return 'discussionForm' . $randomNumber; 
} 

Điều này cho phép nhiều mẫu nhận xét không có cùng id. Thảo luậnForm20, discussionForm21, discussionForm22, v.v.

Tôi có thể xóa thành phần biểu mẫu của symfony2 khỏi hỗn hợp và tạo biểu mẫu/xử lý việc gửi bằng cách sử dụng logic PHP chuẩn nhưng bây giờ tôi đang chống lại điều đó.

Có ai biết tại sao biểu mẫu mã thông báo CSRF không hợp lệ không? Bất kỳ đề xuất về cách này có thể được sửa đổi hoặc làm thế nào bạn làm điều đó?

Answer 1

Hãy thử với hàm JQuery đầy đủ: submit()^^ Trong giải pháp của tôi, tôi cho rằng biểu mẫu của bạn có id "comment_form". Hoạt động trên tất cả các dự án sf2 của tôi:

$('#comment_form').submit(function(e) { 

    var url = $(this).attr("action"); 

    $.ajax({ 
     type: "POST", 
     url: url, // Or your url generator like Routing.generate('discussion_create') 
     data: $(this).serialize(), 
     dataType: "html", 
     success: function(msg){ 

      alert("Success!"); 

     } 
    }); 

    return false; 

}); 

Trường CSRF thường được gửi!

Và đừng quên thêm thẻ twig {{form_rest (form)}} vào mẫu biểu mẫu của bạn, điều này sẽ tạo tất cả trường ẩn như CSRF.