[Vuejs]-How can Vue.js to create a meta tag to store the `csrftoken` like Django, Laravel?

0đź‘Ť

You can try what this blog said. He exposed a props from vue template.

//Add this to your vue js
<script>
export default {
    props: ['csrfToken'],
    mounted () {
        // Do something useful with the data in the template
        console.dir(this.csrfToken)
    }
}
</script>

<!-- Add this to your html/php/template -->
<sample-component :csrf-token="'{!! csrf_token() !!}'">
</sample-component>

EDIT

Sorry i was out the weekend, i’m not familiar with the django-rest-framework so i can’t really help anymore. But i tried and read some of there documentation regarding this. here are the two documents i’ve found online;this and this

The first link states that:

If you activate CSRF_USE_SESSIONS, you must include the CSRF token in your HTML and read the token from the DOM with JavaScript:

{% csrf_token %}
<script type="text/javascript">
// using jQuery
var csrftoken = jQuery("[name=csrfmiddlewaretoken]").val();
</script>

So i think you need to activate “CSRF_USE_SESSIONS” first before you can use the codeblock above.

Leave a comment