how can reactjs access session data(username) from django

Question

i am using django with reactjs, and now i have maintained session and want to access session data by reactjs to cutomise UI. what all can i do for this?

//my models.py snippet

class Users(models.Model):
    gender = models.CharField(max_length=200)
    username = models.CharField(max_length=50)
    password = models.CharField(max_length=50)
    first_name = models.CharField(max_length=30)
    last_name = models.CharField(max_length=40)
    email = models.EmailField()
    address = models.CharField(max_length=50)
    city = models.CharField(max_length=60)
    state = models.CharField(max_length=30)
    country = models.CharField(max_length=50)
    bg = models.CharField(max_length=200)
    badges = models.BigIntegerField(null=True)
    dob = models.DateField()
    contact = models.BigIntegerField(null=True)
    age = models.BigIntegerField(default=0)
    status = models.BigIntegerField(null=True)




//my views.py snippet

def login(request):
    print(request.POST.get('username'))
    username=str(request.POST.get('username'))
    password=str(request.POST.get('password'))

    if(Users.objects.filter(password=password, username=username).exists()):
        request.session['username'] = username
        name=request.session['username']
        return render(request, 'loggedin.html', {"username" : name})
    else:
        return HttpResponse("incorrect data")

just a suggestion.. dont mix react and django for front end development.. use on react/redux on front side and maybe django-rest on backend. I had lot of trouble while working on a project which involved this scenario and had to eventually move towards using completely react on front end. — Harkirat Saluja
– Harkirat Saluja, Commented Sep 30, 2016 at 16:58
You can use the Django Rest Framework to make an endpoint which responds with the user info - the endpoint receives the normal Request object, so you can just return request.user.username, etc. — Jens Astrup
– Jens Astrup, Commented Sep 30, 2016 at 17:34

imolitor · Accepted Answer · 2017-01-31 17:09:13Z

One way to do this is by following the django-react-template from Scott Woodall on GitHub.
Basically, his approach to this is to stuff the user-request data into Django's 'base.html' (in the project it is called app.html) which is served by the backend (Django)

On the frontend side, he is accessing the data via the 'window' object.

{% load static %}
<!-- This is basically the ONLY webpage created in Django
see the window.django = {} part where variables are handed over initially to React
top most the Django CSRF Token
is this secure in Production?
...
...
-->

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Django & React Starter</title>
        ...
        ...
    </head>
    <body>
        <noscript>This application requires javascript to function.</noscript>
        <div id="root"></div>
        <script src="{% static "js/vendor.bundle.js" %}"></script>
        <script>
        window.django = {
            csrf: "{{ csrf_token }}",
            urls: {
                logout: "{% url "logout" %}",
                staticRoot: "{% static "" %}",
                users: "{% url "emailuser-list" %}"
            },
            user: {
                username: "{{ request.user.username }}",
                full_name: "{{ request.user.get_full_name }}",
                last_login: "{{ request.user.last_login }}",
                permissions: immutable.Set(
                    {% autoescape off %}JSON.parse('{{ permissions }}'){% endautoescape %}
                )
            }
        };
        </script>
        <script src="{% static "js/bundle.js" %}"></script>
    </body>
</html>

All credits to Scott Woodall o/ I hope that gets you started!

This is what we do in our apps and it works really well. Initially we thought about calling the server for a chunk of JSON when our js apps had initialised, but that worked too convoluted. This approach is simple and it works perfectly.

Collectives™ on Stack Overflow

how can reactjs access session data(username) from django

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related