mirror of https://github.com/django/django.git
Rewrote CSRF JavaScript example without jQuery.
This commit is contained in:
parent
9736137cdc
commit
3fe5d0128b
|
@ -137,39 +137,29 @@ and read the token from the DOM with JavaScript:
|
|||
|
||||
{% csrf_token %}
|
||||
<script>
|
||||
// using jQuery
|
||||
var csrftoken = jQuery("[name=csrfmiddlewaretoken]").val();
|
||||
var csrftoken = document.querySelector('[name=csrfmiddlewaretoken]').value;
|
||||
</script>
|
||||
|
||||
Setting the token on the AJAX request
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
|
||||
Finally, you'll have to actually set the header on your AJAX request, while
|
||||
protecting the CSRF token from being sent to other domains using
|
||||
`settings.crossDomain <https://api.jquery.com/jQuery.ajax/>`_ in jQuery 1.5.1
|
||||
and newer:
|
||||
Finally, you'll need to set the header on your AJAX request. Using the
|
||||
`fetch()`_ API:
|
||||
|
||||
.. code-block:: javascript
|
||||
|
||||
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);
|
||||
}
|
||||
}
|
||||
var request = new Request(
|
||||
/* URL */,
|
||||
{headers: {'X-CSRFToken': csrftoken}}
|
||||
);
|
||||
fetch(request, {
|
||||
method: 'POST',
|
||||
mode: 'same-origin' // Do not send CSRF token to another domain.
|
||||
}).then(function(response) {
|
||||
// ...
|
||||
});
|
||||
|
||||
If you're using AngularJS 1.1.3 and newer, it's sufficient to configure the
|
||||
``$http`` provider with the cookie and header names:
|
||||
|
||||
.. code-block:: javascript
|
||||
|
||||
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
|
||||
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
|
||||
.. _fetch(): https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch
|
||||
|
||||
Using CSRF in Jinja2 templates
|
||||
------------------------------
|
||||
|
|
Loading…
Reference in New Issue