Search code examples
reactjsdjangodjango-rest-frameworkcsrf-tokendjango-cors-headers

Setup React/DRF without using CORS or CSRF tokens


I have seen a great tutorial on YouTube where react was manually setup with DRF. Throughout the tutorial csrf tokens and django-cors-headers were not used at all. I am trying to achieve the same using npx create-react-app however csrf tokens and cors become an issue doing it this way. How am I able to avoid CSRF and CORS with my drf/react app!

This is the tutorial: https://www.youtube.com/watch?v=6c2NqDyxppU&t=1s


Solution

  • In Above Video, Application use same host name (No Cross Origins Requests Implemented - so you don't need any CORS) And it is single page application. And route your Django app URL ('/') to index.html. React will use Django static files and index.html route. and all other URL routes work with react push method (Here we use REST API endpoints in react pages - so you don't need any CSRF tokens).

    Typically it is good for small and medium size projects. but when you scale app like store static files in cloud buckets you can big headache. Docker Images will Help you in production.