Laravel CSRF 토큰 불일치 아약스 POST 요청에 대한

해결법

1.당신은 당신의 아약스 요청에 데이터를 추가해야합니다. 이 작업을 할 수 있도록 나는 희망한다.

당신은 당신의 아약스 요청에 데이터를 추가해야합니다. 이 작업을 할 수 있도록 나는 희망한다.
```
data: {
        "_token": "{{ csrf_token() }}",
        "id": id
        }
```
2.이 문제 "X-CSRF 토큰"을 해결하는 가장 좋은 방법은 메인 레이아웃에 다음 코드를 추가하는 것입니다, 그리고 일반적으로 귀하의 아약스 호출을 계속 :

이 문제 "X-CSRF 토큰"을 해결하는 가장 좋은 방법은 메인 레이아웃에 다음 코드를 추가하는 것입니다, 그리고 일반적으로 귀하의 아약스 호출을 계속 :

헤더
```
<meta name="csrf-token" content="{{ csrf_token() }}" />
```
스크립트에서
```
<script type="text/javascript">
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
</script>
```
3.나는 형태로 토큰을 넣어 ID로이 토큰을 얻을 더 나은 생각

나는 형태로 토큰을 넣어 ID로이 토큰을 얻을 더 나은 생각
```
<input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
```
그리고 jQuery를 :
```
var data = {
        "_token": $('#token').val()
    };
```
이 방법은, 당신의 JS는 블레이드 파일에있을 필요는 없습니다.

4.아약스 호출 : 난 그냥 헤더를 추가 :

아약스 호출 : 난 그냥 헤더를 추가 :

  headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},

보기 :

<div id = 'msg'>
     This message will be replaced using Ajax. Click the button to replace the message.
</div>

{{ Form::submit('Change', array('id' => 'ajax')) }}

아약스 기능 :

<script>
 $(document).ready(function() {
    $(document).on('click', '#ajax', function () {
      $.ajax({
         type:'POST',
         url:'/ajax',
         headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
         success:function(data){
            $("#msg").html(data.msg);
         }
      });
    });
});
</script>

컨트롤러 :

public function call(){
    $msg = "This is a simple message.";
    return response()->json(array('msg'=> $msg), 200);
}

routes.php에서

Route::post('ajax', 'AjaxController@call');

5.당신은 당신의 메타 태그를 포함하는 당신이 머리 섹션에서 메타 태그를 넣을 수 있습니다 (또는 당신이 그것을 이름을 무엇이든)보다, 템플릿 파일을 사용하는 경우.

당신은 당신의 메타 태그를 포함하는 당신이 머리 섹션에서 메타 태그를 넣을 수 있습니다 (또는 당신이 그것을 이름을 무엇이든)보다, 템플릿 파일을 사용하는 경우.

@section('head')
<meta name="csrf_token" content="{{ csrf_token() }}" />
@endsection

다음 것은, 당신은, 내가 서버 측 처리에 DataTable을 사용하고 내 예제에서 (아약스에 헤더 속성을 둘 필요가 :

"headers": {'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')}

여기에 전체 데이터 테이블 아약스 예입니다 :

$('#datatable_users').DataTable({
        "responsive": true,
        "serverSide": true,
        "processing": true,
        "paging": true,
        "searching": { "regex": true },
        "lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100, "All"] ],
        "pageLength": 10,
        "ajax": {
            "type": "POST",
            "headers": {'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')},
            "url": "/getUsers",
            "dataType": "json",
            "contentType": 'application/json; charset=utf-8',
            "data": function (data) {
                console.log(data);
            },
            "complete": function(response) {
                console.log(response);
           }
        }
    });

이 일 후에는 아약스 요청에 대해 200 개 상태를 확인해야한다.

6.편의를 위해 설정되어있는 X-XSRF 토큰 쿠키가 있다는 것을 알 수 있습니다. 각도 등 같은 프레임 워크는 기본적으로 설정합니다. 다큐먼트 https://laravel.com/docs/5.7/csrf#csrf-x-xsrf-token에서이 옵션을 선택합니다 당신은 그것을 사용하실 수 있습니다.

편의를 위해 설정되어있는 X-XSRF 토큰 쿠키가 있다는 것을 알 수 있습니다. 각도 등 같은 프레임 워크는 기본적으로 설정합니다. 다큐먼트 https://laravel.com/docs/5.7/csrf#csrf-x-xsrf-token에서이 옵션을 선택합니다 당신은 그것을 사용하실 수 있습니다.

가장 좋은 방법은 쿠키가 비활성화 된 메타, 케이스를 사용하는 것입니다.
```
    var xsrfToken = decodeURIComponent(readCookie('XSRF-TOKEN'));
    if (xsrfToken) {
        $.ajaxSetup({
            headers: {
                'X-XSRF-TOKEN': xsrfToken
            }
        });
    } else console.error('....');
```
다음은 권장 메타 방법은 (당신은 필드에게 어떤 방법을 넣을 수 있지만, 메타 조용한 좋은입니다) :
```
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});   
```
decodeURIComponent ()의 사용을 참고 URI 형식에서 그것의 디코딩 쿠키를 저장하는 데 사용된다. [그렇지 않으면 당신은 laravel에서 잘못된 페이로드 예외를 얻을 것이다].

여기에 문서의 CSRF 쿠키에 대한 부분은 확인합니다 : https://laravel.com/docs/5.7/csrf#csrf-x-csrf-token

또한 여기에 방법 laravel (bootstrap.js) 기본적으로 Axios의 그것을 설정하는 것입니다 :
```
let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
} 
```
당신은 체크 자원 / JS / bootstrap.js을 갈 수 있습니다.

그리고 여기 쿠키 기능을 읽을 수 :
```
   function readCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
       }
        return null;
    }
```

7.토큰을 보유하고 메타 요소에 ID를 추가

토큰을 보유하고 메타 요소에 ID를 추가

<meta name="csrf-token" id="csrf-token" content="{{ csrf_token() }}">

그리고 당신은 당신의 자바 스크립트를 얻을 수 있습니다

$.ajax({
  url : "your_url",
  method:"post",
  data : {
    "_token": $('#csrf-token')[0].content  //pass the CSRF_TOKEN()
  },  
  ...
});

편집 : 메타 라인을 변경하지 않고 더 쉬운 방법입니다.

data : { 
    _token: "{{ csrf_token() }}" 
}

또는

data : { 
    _token: @json(csrf_token()), 
}

마틴 - 하르트만 @ 감사합니다

8.당신이 AJAX 게시물을 보낼 jQuery를 사용하는 경우, 모든보기에이 코드를 추가합니다 :

당신이 AJAX 게시물을 보낼 jQuery를 사용하는 경우, 모든보기에이 코드를 추가합니다 :
```
$( document ).on( 'ajaxSend', addLaravelCSRF );

function addLaravelCSRF( event, jqxhr, settings ) {
    jqxhr.setRequestHeader( 'X-XSRF-TOKEN', getCookie( 'XSRF-TOKEN' ) );
}

function getCookie(name) {
    function escape(s) { return s.replace(/([.*+?\^${}()|\[\]\/\\])/g, '\\$1'); };
    var match = document.cookie.match(RegExp('(?:^|;\\s*)' + escape(name) + '=([^;]*)'));
    return match ? match[1] : null;
}
```
Laravel 모든 요청에 XSRF 쿠키를 추가하고, 우리는 자동 직전에 제출하는 모든 AJAX 요청에 추가합니다.

거기에 또 다른 기능입니다 jQuery와 같은 일을 할 플러그인 경우의 getCookie 기능을 대체 할 수 있습니다.
9.Laravel 5.8, 레이아웃에 대한 CSRF 메타 태그를 설정하고 이미 Laravel에 의해 생성 된 _token 입력 필드가 엔진을하는 주형 블레이드 포함하는 양식을 제출 아약스를 사용하지 작동하는지 아약스 설정에서 CSRF에 대한 요청 헤더를 설정하십시오.

Laravel 5.8, 레이아웃에 대한 CSRF 메타 태그를 설정하고 이미 Laravel에 의해 생성 된 _token 입력 필드가 엔진을하는 주형 블레이드 포함하는 양식을 제출 아약스를 사용하지 작동하는지 아약스 설정에서 CSRF에 대한 요청 헤더를 설정하십시오.

서버가 아니라 당신의 메타 태그의 하나가 기대 될 수 있기 때문에 당신은 이미 아약스 요청과 함께 양식에서 토큰 CSRF 생성을 포함해야합니다.

예를 들어,이 블레이드에 의해 생성 된 _token 입력 필드와 같은 모습입니다 :
```
<form>
    <input name="_token" type="hidden" value="cf54ty6y7yuuyyygytfggfd56667DfrSH8i">
    <input name="my_data" type="text" value="">
    
</form>
```
그런 다음이 같은 아약스와 양식을 제출 :
```
<script> 
    $(document).ready(function() { 
        let token = $('form').find('input[name="_token"]').val();
        let myData = $('form').find('input[name="my_data"]').val();
        $('form').submit(function() { 
            $.ajax({ 
                type:'POST', 
                url:'/ajax', 
                data: {_token: token, my_data: myData}
                // headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}, // unnecessary 
                // other ajax settings
            }); 
            return false;
        }); 
    }); 
</script>
```
당신이 블레이드가 입력 필드를 _token 생성하지 않고 양식을 제출하는 경우 메타 헤더에 토큰 CSRF에만 유용합니다.
10.누가 적 허용 대답 @Deepak saini으로 문제를지고, 제거하려고

누가 적 허용 대답 @Deepak saini으로 문제를지고, 제거하려고
```
cache:false,
processData:false,
contentType:false,
```
아약스 호출.

사용하다
```
dataType:"json",
```

11.사실이 오류를했고 해결책을 찾을 수 없습니다. 사실 아약스 요청을하고 있지 끝났다. 이 문제는 내 서버 또는 무엇에이 존재 하위 도메인 때문 나도 몰라. 여기 내 jQuery의.

사실이 오류를했고 해결책을 찾을 수 없습니다. 사실 아약스 요청을하고 있지 끝났다. 이 문제는 내 서버 또는 무엇에이 존재 하위 도메인 때문 나도 몰라. 여기 내 jQuery의.

            $('#deleteMeal').click(function(event) {
                var theId = $(event.currentTarget).attr("data-mealId");
                  $(function() {
                    $( "#filler" ).dialog({
                      resizable: false,
                      height:140,
                      modal: true,
                      buttons: {
                      "Are you sure you want to delete this Meal? Doing so will also delete this meal from other users Saved Meals.": function() {
                           $('#deleteMealLink').click();
//                         jQuery.ajax({
//                              url : 'http://www.mealog.com/mealtrist/meals/delete/' + theId,
//                              type : 'POST',
//                              success : function( response ) {
//                                  $("#container").replaceWith("<h1 style='color:red'>Your Meal Has Been Deleted</h1>");
//                              }
//                          });
                        // similar behavior as clicking on a link
                           window.location.href = 'http://www.mealog.com/mealtrist/meals/delete/' + theId;
                          $( this ).dialog( "close" );
                        },
                        Cancel: function() {
                          $( this ).dialog( "close" );
                        }
                      }
                    });
                  });
                });

사실 오히려 나는 대부분의 응용 프로그램이 할내는 것 인 포스트 요청을하는 것보다 내 API로 이동하는 앵커를 설정 그래서.

  <p><a href="http://<?php echo $domain; ?>/mealtrist/meals/delete/{{ $meal->id }}" id="deleteMealLink" data-mealId="{{$meal->id}}" ></a></p>

12.당신은 그래서 CSRF 보호 미들웨어가 요청의 유효성을 검사 할 수있는 형태의 숨겨진 CSRF (크로스 사이트 요청 위조) 토큰 필드를 포함해야한다.

당신은 그래서 CSRF 보호 미들웨어가 요청의 유효성을 검사 할 수있는 형태의 숨겨진 CSRF (크로스 사이트 요청 위조) 토큰 필드를 포함해야한다.

Laravel 자동으로 애플리케이션에 의해 관리되는 각각의 활성 사용자 세션에 대한 CSRF "토큰"생성한다. 이 토큰은 인증 된 사용자가 하나의 응용 프로그램에 실제로 보는 건 gthe 요청이 있는지 확인하는 데 사용됩니다.

아약스 요청을 할 때 그래서, 당신은 CSRF 토큰을 통해 데이터 매개 변수를 전달해야합니다. 다음은 샘플 코드입니다.
```
var request = $.ajax({
    url : "http://localhost/some/action",
    method:"post",
    data : {"_token":"{{ csrf_token() }}"}  //pass the CSRF_TOKEN()
  });
```
13.난 그냥 형태와 작업 벌금 내부 @csrf 사용

난 그냥 형태와 작업 벌금 내부 @csrf 사용

14.세션이 만료 될 경우, 당신이 사용할 수있는, 다시 로그인

세션이 만료 될 경우, 당신이 사용할 수있는, 다시 로그인

$(document).ajaxComplete(function(e, xhr, opt){
  if(xhr.status===419){
    if(xhr.responseJSON && xhr.responseJSON.message=='CSRF token mismatch.') window.location.reload();
  }
});

from https://stackoverflow.com/questions/32738763/laravel-csrf-token-mismatch-for-ajax-post-request by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 자바 스크립트를 사용하여 URL 확인하려고 (0)	2020.10.11
[JQUERY] 일치하지 않는 익명 () 모듈을 정의 (0)	2020.10.11
[JQUERY] 어떻게 jQuery를 클론 () 변경 ID로? (0)	2020.10.11
[JQUERY] JQUERY 검사 요소가 뷰포트에 표시되면 [중복] (0)	2020.10.11
[JQUERY] jQuery를 - 가져 오기 너비 요소의 경우 표시되지 않음 (표시 : 없음) (0)	2020.10.11

복붙노트

[JQUERY] Laravel CSRF 토큰 불일치 아약스 POST 요청에 대한

Laravel CSRF 토큰 불일치 아약스 POST 요청에 대한

해결법

1.당신은 당신의 아약스 요청에 데이터를 추가해야합니다. 이 작업을 할 수 있도록 나는 희망한다.

2.이 문제 "X-CSRF 토큰"을 해결하는 가장 좋은 방법은 메인 레이아웃에 다음 코드를 추가하는 것입니다, 그리고 일반적으로 귀하의 아약스 호출을 계속 :

3.나는 형태로 토큰을 넣어 ID로이 토큰을 얻을 더 나은 생각

4.아약스 호출 : 난 그냥 헤더를 추가 :

5.당신은 당신의 메타 태그를 포함하는 당신이 머리 섹션에서 메타 태그를 넣을 수 있습니다 (또는 당신이 그것을 이름을 무엇이든)보다, 템플릿 파일을 사용하는 경우.

7.토큰을 보유하고 메타 요소에 ID를 추가

8.당신이 AJAX 게시물을 보낼 jQuery를 사용하는 경우, 모든보기에이 코드를 추가합니다 :

10.누가 적 허용 대답 @Deepak saini으로 문제를지고, 제거하려고

11.사실이 오류를했고 해결책을 찾을 수 없습니다. 사실 아약스 요청을하고 있지 끝났다. 이 문제는 내 서버 또는 무엇에이 존재 하위 도메인 때문 나도 몰라. 여기 내 jQuery의.

12.당신은 그래서 CSRF 보호 미들웨어가 요청의 유효성을 검사 할 수있는 형태의 숨겨진 CSRF (크로스 사이트 요청 위조) 토큰 필드를 포함해야한다.

13.난 그냥 형태와 작업 벌금 내부 @csrf 사용

14.세션이 만료 될 경우, 당신이 사용할 수있는, 다시 로그인

'JQUERY' 카테고리의 다른 글

티스토리툴바