https://www.guguweb.com/2022-01-14T21:06:19+01:00Freelance developer and sysadmin2021-06-12T12:34:09+00:002022-01-14T21:06:19+01:00Augusto Destrerotag:www.guguweb.com,2021-06-12:/2021/06/12/integrate-axios-with-django-rest-framework/

<p>Do you need to integrate the Axios HTTP client with Django Rest Framework? Then make sure to correctly configure the Django built-in Cross Site Request Forgery protection.</p> <p>TLDR: add these variables to your Django settings:</p> <div class="highlight"><pre><span></span><code><span class="n">CSRF_COOKIE_NAME</span> <span class="o">=</span> <span class="s1">&#39;XSRF-TOKEN&#39;</span> <span class="n">CSRF_HEADER_NAME</span> <span class="o">=</span> <span class="s1">&#39;HTTP_X_XSRF_TOKEN&#39;</span> </code></pre></div> <p>Axios has built-in support …</p>

<p>Do you need to integrate the Axios HTTP client with Django Rest Framework? Then make sure to correctly configure the Django built-in Cross Site Request Forgery protection.</p> <p>TLDR: add these variables to your Django settings:</p> <div class="highlight"><pre><span></span><code><span class="n">CSRF_COOKIE_NAME</span> <span class="o">=</span> <span class="s1">&#39;XSRF-TOKEN&#39;</span> <span class="n">CSRF_HEADER_NAME</span> <span class="o">=</span> <span class="s1">&#39;HTTP_X_XSRF_TOKEN&#39;</span> </code></pre></div> <p>Axios has built-in support for CSRF protection, and this is the default configuration:</p> <div class="highlight"><pre><span></span><code><span class="c1">// name of the cookie to use as a value for xsrf token</span> <span class="nx">xsrfCookieName</span><span class="o">:</span> <span class="s1">&#39;XSRF-TOKEN&#39;</span> <span class="c1">// name of the http header that carries the xsrf token value</span> <span class="nx">xsrfHeaderName</span><span class="o">:</span> <span class="s1">&#39;X-XSRF-TOKEN&#39;</span> </code></pre></div> <p>According to <a href="https://docs.djangoproject.com/en/3.2/ref/settings/#csrf-header-name">Django documentation</a>:</p> <blockquote> <blockquote> <blockquote> <p>"As with other HTTP headers in request.META, the header name received from the server is normalized by converting all characters to uppercase, replacing any hyphens with underscores, and adding an 'HTTP_' prefix to the name. For example, if your client sends a 'X-XSRF-TOKEN' header, the setting should be 'HTTP_X_XSRF_TOKEN'."</p> </blockquote> </blockquote> </blockquote>