问题描述
我有一个集成了Vue.js的Laravel 5.3项目,我想在表单中使用 CSRF-TOKEN
。表单html代码位于Vue组件文件中
I have Laravel 5.3 project with Vue.js integrated and I want to use CSRF-TOKEN
in my form. Form html code is in Vue component file in
资源/资产/js/bootstrap.js
我有这个:
Vue.http.interceptors.push((request, next) => {
request.headers.set('X-CSRF-TOKEN', MyApp.csrfToken);
next();
});
然后我有主Vue文件 / resources / assets / js / app。 js
:
then I have main vue file /resources/assets/js/app.js
:
require('./bootstrap');
Vue.component('callbackwindow', require('./components/callbackwindow.vue'));
const app = new Vue({
el: '#app',
data: { },
});
然后在Vue文件中,我需要使用 csrf_field
,但我不知道如何到达那里,因为标准php csrf_field()
不会在Vue组件内呈现,而且我也不知道如何导入 MyApp.csrfToken
。
then in Vue file I need to use csrf_field
, but I don't know how to get it there, because standard php csrf_field()
is not rendered inside Vue component and I don't know how to import MyApp.csrfToken
.
<template>
<div class="modal fade" >
<form @submit.prevent="submitForm" name="callback" method="POST" action="/" role="form" class="form-horizontal" enctype="multipart/form-data">
{!! csrf_field() !!}
...form code here...
</form>
</div>
</template>
<script>
export default { }
</script>
是否可以导入 MyApp.csrfToken
推荐答案
作为替代方法:
1-从< head>
中的 csrf-token
名称的元标记中获取令牌:
1- Get the token from meta tag with csrf-token
name inside of <head>
:
$('meta[name="csrf-token"]').attr('content')
2-将其作为道具传递给Vue组件:
2- Pass it as a prop to your Vue component:
<your-component :csrf-token="{{ csrf_token() }}"></your-component>
这篇关于Vue组件中的CSRF令牌的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!