Deion I wanted to hear if there is any interest in adding th

There's no need for any Java. You can use hx-headers</

Okay, my bad, I somehow totally missed the <body></cod

Add X-CSRFToken via htmx:configRequest event about django-htmx HOT 3 CLOSED

adamchainz commented on July 24, 2024

Add X-CSRFToken via htmx:configRequest event

from django-htmx.

Comments (3)

adamchainz commented on July 24, 2024 1

There's no need for any Javascript. You can use hx-headers - this is already documented in the example project CSRF demo:

django-htmx/example/example/templates/csrf-demo.html

Lines 4 to 22 in 2c1f95b

    
             <section> 
        
               <p> 
        
                 This form shows you how to implement CSRF with htmx, using <a href="https://dev.htmx.org/attributes/hx-headers/"> the<code>hx-headers</code> attribute</a>. 
        
               </p> 
        
             </section> 
        
             <section> 
        
               <!-- 
        
                 Note you can place the hx-headers attribute on your <body> tag so it 
        
                 affects all requests, reducing repetition. 
        
                 The header name may be changed with the CSRF_HEADER_NAME setting; 
        
                 https://docs.djangoproject.com/en/stable/ref/settings/#std:setting-CSRF_HEADER_NAME 
        
                 Note we use {{ csrf_token }} instead of {% csrf_token %} to get the 
        
                 variable rather than a rendered HTML <input>. 
        
               --> 
        
               <form hx-post="/csrf-demo/checker/" 
        
                     hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}' 
        
                     hx-target="#result">

I'm further adding a docs page in the Docs PR: https://github.com/adamchainz/django-htmx/pull/194/files#diff-3d3c9ddabd7ba7f0fa458351d17598c03548245af53febc5c09fd829bb42dea1

from django-htmx.

valberg commented on July 24, 2024

Oh yes I knew that :) But having to add that to each html tag where you want to do htmx requests "gets tedious". I started using hx-headers initially but kept on forgetting them, which is why I turned to the configRequest event - to remove friction :)

Anyway, I'll consider this as out-of-scope for django-htmx :)

from django-htmx.

valberg commented on July 24, 2024

Okay, my bad, I somehow totally missed the <body> part! That definitely makes my suggestion irrelevant! Thanks @adamchainz !

from django-htmx.

Recommend Projects

Add X-CSRFToken via htmx:configRequest event about django-htmx HOT 3 CLOSED

Comments (3)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent

	<section>
	<p>
	This form shows you how to implement CSRF with htmx, using <a href="https://dev.htmx.org/attributes/hx-headers/"> the<code>hx-headers</code> attribute</a>.
	</p>
	</section>
	<section>
	<!--
	Note you can place the hx-headers attribute on your <body> tag so it
	affects all requests, reducing repetition.

	The header name may be changed with the CSRF_HEADER_NAME setting;
	https://docs.djangoproject.com/en/stable/ref/settings/#std:setting-CSRF_HEADER_NAME

	Note we use {{ csrf_token }} instead of {% csrf_token %} to get the
	variable rather than a rendered HTML <input>.
	-->
	<form hx-post="/csrf-demo/checker/"
	hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
	hx-target="#result">