Ajax 요청에 CSRFToken 추가

Ajax 요청에 CSRFToken 추가

통과해야 해CSRFTokenAjax 기반 포스트 요청을 사용하지만 이 작업이 어떻게 최선인지 확실하지 않습니다.내부적으로 확인하는 플랫폼 사용CSRFTokenin request (POST 요구만)

처음에 머리글에 추가하려고 했는데

$(function() {
    $.ajaxSetup({
        headers : {
            'CSRFToken' : getCSRFTokenValue()
        }
    });
});

그러면 각 Ajax 요청에 사용할 수 있지만, 제 경우엔 작동하지 않을 것입니다. 요청 중이기 때문입니다.CSRFToken아직 null로 되어 있습니다.

내가 어떻게 설정 할 수 있는 방법은 없을까?CSRFToken에 관한 모든 Ajax 콜에 대해POST유형

Ajax 콜에서 이와 같은 작업을 수행할 경우 편집

data: {"newsletter-subscription-email" : "XXX" , 'CSRFToken': getCSRFTokenValue()},

다 잘 되고 있어요.

나의 문제는 합격하고 싶다는 것이다.CSRFToken요청 헤더가 아닌 요청 매개 변수로서의 값

이건 어때?

$("body").bind("ajaxSend", function(elm, xhr, s){
   if (s.type == "POST") {
      xhr.setRequestHeader('X-CSRF-Token', getCSRFTokenValue());
   }
});

참고 자료: http://erlend.oftedal.no/blog/?http://http://erlend.oftedal.no/blog/

합격하다CSRF파라미터로서

        $.ajax({
            type: "POST",
            url: "file",
            data: { CSRF: getCSRFTokenValue()}
        })
        .done(function( msg ) {
            alert( "Data: " + msg );
        });

다음을 사용할 수 있습니다.

var token = "SOME_TOKEN";

$.ajaxPrefilter(function (options, originalOptions, jqXHR) {
  jqXHR.setRequestHeader('X-CSRF-Token', token);
});

문서부터:

jQuery.ajaxPrefilter([dataTypes], 핸들러(옵션, originalOptions, jqXHR))

설명:각 요청이 전송되기 전 및 $.ajax()에 의해 처리되기 전에 커스텀 Ajax 옵션을 처리하거나 기존 옵션을 수정합니다.

읽어주세요

다음은 Ajax와 함께 POST 요청을 보낼 때 CSRF 토큰 문제를 방지하기 위해 사용한 코드입니다.

$(document).ready(function(){
    function getCookie(c_name) {
        if(document.cookie.length > 0) {
            c_start = document.cookie.indexOf(c_name + "=");
            if(c_start != -1) {
                c_start = c_start + c_name.length + 1;
                c_end = document.cookie.indexOf(";", c_start);
                if(c_end == -1) c_end = document.cookie.length;
                return unescape(document.cookie.substring(c_start,c_end));
            }
        }
        return "";
    }

    $(function () {
        $.ajaxSetup({
            headers: {
                "X-CSRFToken": getCookie("csrftoken")
            }
        });
    });

});

JSP에서

<form method="post" id="myForm" action="someURL">
    <input name="csrfToken" value="5965f0d244b7d32b334eff840...etc" type="hidden">    
</form>

이것은 3시간 동안 고생한 후 나에게 가장 간단한 방법입니다. 이렇게 입력 숨김 필드에서 토큰을 가져오고 AJAX 요청을 하는 동안 이 토큰을 헤더에 전달하면 다음과 같이 됩니다.

Jquery에서

var token =  $('input[name="csrfToken"]').attr('value'); 

플레인 Javascript에서

var token = document.getElementsByName("csrfToken").value;

최종 AJAX 요청

$.ajax({
      url: route.url,
      data : JSON.stringify(data),
      method : 'POST',
      headers: {
                    'X-CSRF-Token': token 
               },
      success: function (data) { ...      },
      error: function (data) { ...  }

});

이제 웹 구성에서 crsf 보안을 비활성화할 필요가 없습니다.또한 콘솔에서도 405(Method Not Allowed) 오류가 나타나지 않습니다.

이것이 사람들에게 도움이 되길 바랍니다.!!

lusca를 사용하여 node.js에서 작업하는 경우 다음 작업도 수행합니다.

$.ajax({
url: "http://test.com",
type:"post"
headers: {'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')}
})

이것은 나에게 효과가 있었다(jQuery 2.1 사용)

$(document).ajaxSend(function(elm, xhr, s){
    if (s.type == "POST") {
        s.data += s.data?"&":"";
        s.data += "_token=" + $('#csrf-token').val();
    }
});

또는 다음과 같습니다.

$(document).ajaxSend(function(elm, xhr, s){
    if (s.type == "POST") {
        xhr.setRequestHeader('x-csrf-token', $('#csrf-token').val());
    }
});

(여기서 #syslogf-syslog는 토큰을 포함하는 요소입니다)

블로그의 투고 리스트에 이 문제가 있었습니다만, 투고는 포어치내의 뷰에 있어 Javascript로 선택하기 어렵고, 투고 방법이나 토큰의 문제도 있습니다.

뷰의 끝에 있는 javascript의 코드입니다.저는 외부 js파일이 아닌 뷰 내의 javascript function에서 토큰을 생성하고 php lavarel을 사용하여 csrf_token() 함수로 생성하고 "delete" 메서드를 직접 파라미터로 전송합니다.var route: {{route('post.destroy', $post->id}}는 삭제하려는 ID를 모르기 때문에 이 문제가 없다면 {{route('post.destroy', $post->id}}} 등)를 사용할 수 있습니다.

  $(function(){
    $(".destroy").on("click", function(){
         var vid = $(this).attr("id");
         var v_token = "{{csrf_token()}}";
         var params = {_method: 'DELETE', _token: v_token};
         var route = "http://imagica.app/posts/" + vid + "";
    $.ajax({
         type: "POST",
         url: route,
         data: params
    });
   });
  });

그리고 이 컨텐츠 코드(내부에는 더 많은 폼과 각 투고의 데이터가 있지만 이 예에서는 중요하지 않음)는 버튼에 클래스를 추가하고 javascript에서 클래스를 호출하는 것을 볼 수 있습니다.

      @foreach($posts as $post)
          <form method="POST">
            <button id="{{$post->id}}" class="btn btn-danger btn-sm pull-right destroy" type="button" >eliminar</button>
          </form>
      @endforeach

위의 답변은 나에게는 통하지 않았다.

Ajax 요청 전에 다음 코드를 추가했습니다.

function getCookie(name) {
                var cookieValue = null;
                if (document.cookie && document.cookie != '') {
                    var cookies = document.cookie.split(';');
                    for (var i = 0; i < cookies.length; i++) {
                        var cookie = jQuery.trim(cookies[i]);
                        // Does this cookie string begin with the name we want?
                        if (cookie.substring(0, name.length + 1) == (name + '=')) {
                            cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                            break;
                        }
                    }
                }
                return cookieValue;
            }
            var csrftoken = getCookie('csrftoken');

            function csrfSafeMethod(method) {
                // these HTTP methods do not require CSRF protection
                return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
            }

            $.ajaxSetup({
                beforeSend: function(xhr, settings) {
                    if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                        xhr.setRequestHeader("X-CSRFToken", csrftoken);
                    }
                }
            });

            $.ajax({
                     type: 'POST',
                     url: '/url/',
            });

var myVar = 'var'를 사용하는 모든 사용자는 아마도 최악의 아이디어일 것입니다.콘솔에서 바로 인쇄할 수 있습니다.클라이언트 측에서 암호화한 후 서버 측에서 복호화해야 합니다.

언급URL : https://stackoverflow.com/questions/22063612/adding-csrftoken-to-ajax-request