Vue 헤더의 X-CSRF-TOKEN이 누락되었습니다.

Question

VueJS 1.0.28을 사용하여 POST를하려고하는데 Laravel 5.3 TokenMismatchException 오류가 발생합니다.

이 커버하는 app.js에 jQuery를하고 뷰 모두 :

Vue.http.interceptors.push((request, next) => { 
    request.headers.set('X-CSRF-TOKEN', Laravel.csrfToken); 

    next(); 
}); 

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

이 우리가 Laravel 값을 인스턴스화 main.blade.php 레이아웃에 있습니다

<script src="{!! asset('/js/app.js') !!}"></script> 
<script> 
    (function() { 
     window.Laravel = { 
      csrfToken: '{{ csrf_token() }}' 
     }; 
    })(); 
</script> 

나는의 헤더를 볼 때 POST 요청에서 Vue에 포함 된 X-CSRF가 표시되지 않습니다.

이것은 jQuery를위한 기본적인 기본 기능이며, 내가 Vue 측에서 잘못 설정 한 것을 엉망으로 만듭니다. 아이디어?

Answer 1

을 : Axios의

는 그렇다면, 당신은 사용하는 단지 것 다음을 수행하여 토큰을 수동으로 가져 오십시오.

xhr.setRequestHeader('X-CSRF-TOKEN', Laravel.csrfToken); 

Answer 2

1. 가능하면 *로 이동하십시오.
2. Vue와 jQuery를 섞어 사용하지 마십시오. 약속 할게, 네 인생을 더 편하게 해줄거야.
3. 예 : AJAX 사용 예. 이 뷰와 jQuery를 모두 토큰을 얻고 있었다, 그러나 그래서가 필요 내가 사용 된 패키지 코드를 직접 XMLHttpRequest를 사용하고, 밝혀으로 axiosDefaults.headers.common['X-CSRF-Token'] = csrfToken;