Getting user data in react from django API?

Question

I am creating a simple blog front end to consume a django backend api. The way it is setup so I can access user data for each post is like this:

post serializer:

class PostSerializer(serializers.ModelSerializer):
    class Meta:
        model = Post
        fields = ['id', 'title', 'body', 'user']
        depth = 1

react, where i display the data

<Container variant='lg' maxWidth='lg'>
              <div className='posts'>
                <Typography key={post.id} variant='h3'>
                  {post.title}
                </Typography>
                <Typography paragraph>
                  {post.body}
                </Typography>
                <Typography paragraph>
                  {post.user.user_name}
                </Typography>
              </div>
</Container>

Now, this does fit as a solution to my problem, in order to have the users username be displayed in post, but it exposes all user data, including email, password hash, last logged in, etc.

What is better way to get user related data when using react?

Hi @stinny. That decision should not taken in the front-end. I think you should serialize the user data in the back end with django ( i have not used django). This is what I have done with rails. You just serialize the user data and in this way you avoid sensitive data of the user in your front-end — Julio Lopez
– Julio Lopez, Commented Jan 25, 2021 at 21:44
@JulioLopez ahhh that makes more sense. I will give that a try! — Stinny
– Stinny, Commented Jan 25, 2021 at 22:05

Dharman · Accepted Answer · 2021-01-25 22:24:10Z

1

Modify your serializer as follows. Instead of using depth get user name as follows

class PostSerializer(serializers.ModelSerializer):
    #use Serializer method fields
    user_name = serializers.SerializerMethodField()

    class Meta:
        model = Post
        fields = ['id', 'title', 'body', 'user_name']

    def get_user_name(self, obj):
        try:
            return obj.user.user_name
        except:
            pass

edited Jan 25, 2021 at 22:24

Dharman♦

34k27 gold badges106 silver badges157 bronze badges

answered Jan 25, 2021 at 22:18

Muteshi

1,4081 gold badge16 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting user data in react from django API?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related