Estou começando com desenvolvimento DJango e React.
Tentei fazer uma página para Autenticação de usuários. Ao carregar a página para Cadastro de Usuário faço uma chamada a API no Django para que retorne o CSRF via Cookie e então eu adicione ao header e form, porém ao carregar a página, mesmo chamando a API, o Cookie fica em branco, sem nenhum valor. Porém, se eu fazer o teste via Postman, eu tenho o Cookie retornado e com o CSRF atualizado, mas via browser o Cookie fica sempre em branco.
Esta é a minha View no Django (A API):
@method_decorator(ensure_csrf_cookie, name='dispatch')
class GetCSRFToken(APIView):
permission_classes = (permissions.AllowAny,)
def get(self, request, format=None):
return Response({'success': 'CSRF cookie definido'})
No React tenho o componente que faz sua chamada para atualizar o CSRF para enviar o formulário.
const CSRFToken = () => {
const [csrftoken, setcsrftoken] = useState('')
const getCookie = (name) => {
let cookieValue = null
if (document.cookie && document.cookie !== '') {
let cookies = document.cookie.split(';')
for (let i = 0; i < cookies.length; i++) {
let cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1))
break
}
}
}
return cookieValue
}
useEffect(() => {
const fetchData = async () => {
try {
axios.get(API_URL_GETCSRFCOOKIE)
.then(resp => {
setcsrftoken(getCookie('csrftoken'))
})
.catch(e => {
e.response.data.errors.forEach(
error => toastr.error('Erro', error)
)
})
} catch (err) {
}
}
fetchData()
setcsrftoken(getCookie('csrftoken'))
}, [])
return (
<input type='hidden' name='csrfmiddlewaretoken' value={csrftoken} />
)
}
Pesquisei a respeito, tentei depurar, mas não consegui identificar onde estou errando. Agradeço a sua atenção ao meu problema.