Ndtyjky

I'm trying to make a post request from a react frontend to a django backend to log a user in, and redirect to a new page. The issue I'm having is that even though the request reaches the server and I can get the data when it comes time for django to redirect, the redirect does not happen and their is an output in the console that says "Broken pipe from ('127.0.0.1', 64989)". I've done some research online about this issue, but I still can't figure out how to fix it. However, everything works fine when I use a an html form element with an action and method type. Below I have shared my code.

React Frontend

handleSubmit = () => {

      let csrfToken = Cookies.get('csrftoken')

      let endpoint = this.state.isLoggingIn ? LOGIN_ENDPOINT : REGISTER_ENDPOINT;

      axios({

          url: endpoint,

          method: "POST",

          data: {

              username: this.state.username,

              password: this.state.password,

              displayName: this.state.displayName,

          },

          headers: {"X-CSRFToken": csrfToken},

          responseType: "json",

      }).then(function (response) {

          console.log(response);

      }).catch(function (error) {

          console.log(error);

      });

    }

Django Backend

def login_view(request):

    if request.method == 'POST':

        #username = request.POST.get('username') <= I use this and below, to get data sent via a form with an action and method set.

        #password = request.POST.get('password')

        body_unicode = request.body.decode('utf-8')

        data = simplejson.loads(body_unicode)

        username = data['username']

        password = data['password']

        user = authenticate(username=username, password=password)

        print user

        if user is not None and user.is_active:

            login(request, user)

            return redirect('chat_app:chat')

        else:

            return JsonResponse({'message': 'Check you username or password'})

    else:

        return render(request, 'frontend/chat_app/home.html')

Following works but is not what I want

With this method I can get the data from the input fields (not shown here)
authenticate the user and redirect them properly. However, I do not want to
use this method because I want to pass back any error messages to the submitFunction() that had been called, or process any other data, in the same page that had made the call.

<form method="POST" action={ENDPOINT}>

                    <input

                        type="hidden"

                        name="csrfmiddlewaretoken"

                        value={csrftoken}

                        />

                     ....