[FIXED] ValueError: The given username must be set

Issue

I'm trying register a user in my project, but when I try to do it I get next error:

ValueError: The given username must be set

In my project I'm using Django 1.11 and AngularJS 1.6

View.py

def registrarCliente(request):
    if request.method=='POST':
        usuariosfinales=[]
        nombre=request.POST.get('nombre')
        email=request.POST.get('email')
        password=request.POST.get('password')

        user=User.objects.create_user(email, email, password)
        user.save()

        usermodelo=Usuario(usuario=user, nombre=nombre)
        usermodelo.save()

        userfinal=authenticate(username=email, password=password)
        login(request, userfinal)

        usuariosfinales.append(userfinal)

        data=serializers.serialize('json', usuariosfinales)

        return HttpResponse(data, content_type="application/json")

    return render (request, "login/login.html")

login.html

<div class="login-wrap" id="login" ng-app="appLogin" ng-controller="conLogin">
  <div class="login-right striped-bg" ng-show="Registro">
    <div class="login-form">
      <div class="heading">
        ¡Registrate!
      </div>
      <div class="input">

        {% csrf_token %}

        <div class="login-input-group spacer-field">
          <span class="login-input-group-addon">
            <i class="fa fa-user fa-fw"></i>
          </span>
          <input type="text" class="form-control" name="nombre" placeholder="Nombre" ng-model="user.nombre">
        </div>
        <div class="login-input-group spacer-field">
          <span class="login-input-group-addon">
            <i class="fa fa-at fa-fw"></i>
          </span>
          <input type="email" class="form-control" name="email" placeholder="Correo electrónico" ng-model="user.email">
        </div>
        <div class="login-input-group spacer-field">
          <span class="login-input-group-addon">
            <i class="fa fa-key fa-fw"></i>
          </span>
          <input type="password" class="form-control" name="password" placeholder="Contraseña" ng-model="user.password">
        </div>
        <div class="login-input-group">
          <span class="login-input-group-addon">
            <i class="fa fa-key fa-fw"></i>
          </span>
          <input type="password" class="form-control" name="password2" placeholder="Repetir contraseña">
        </div>

        <button class="btn btn-default btn-lg submit" type="submit" ng-click="registrar()">Registrarme</button>
      </div>
    </div>
  </div>
</div>

appLogin.js

(function(angular) {

// body...
angular
    .module('appLogin', [])
    .controller('conLogin', ['$scope', '$http', function($scope, $http){
        //Registro de usuario
        $scope.user = {nombre:'', email:'', password:''};

        $scope.registrar = function(email, password){
            $http({method:'POST',
                url:'/registro/',
                data:{nombre: $scope.user.nombre, email: $scope.user.email, password: $scope.user.password}
            }).then(
                function(response2){
                    window.location.href='';
                },function(response2){
                    $scope.user = response2.data || 'Request failed';
                }
            );
        }

        $scope.Ingreso = true;
        $scope.Registro = false;

        $scope.cambioRegistro = function(){
            $scope.Ingreso = false;
            $scope.Registro = true;
        }

        $scope.cambioIngreso = function(){
            $scope.Ingreso = true;
            $scope.Registro = false;
        }
    }])

var my_app = angular
    .module('appLogin').config(
        function($interpolateProvider, $httpProvider) {
            $interpolateProvider.startSymbol('{$');
            $interpolateProvider.endSymbol('$}');
            $httpProvider.defaults.xsrfCookieName = 'csrftoken';
            $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
            $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
            $httpProvider.defaults.withCredentials = true;
            $httpProvider.defaults.cache = true;
        }
    );

})(window.angular);

The debug page says me that my error is in:

user=User.objects.create_user(email, email, password)

But I don't understand why.

Solution

I was sending data just like this:

data:{nombre: $scope.user.nombre, email: $scope.user.email, password: $scope.user.password}

There I wasn't using $.param jquery function because I don't had jquery, I imported jquery, I changed the code above for a code with $.param just like this:

data:$.param({nombre: $scope.user.nombre, email: $scope.user.email, password: $scope.user.password})

And finally works!

The final AngularJS code is:

appLogin.js

angular
    .module('appLogin', [])
    .controller('conLogin', ['$scope', '$http', function($scope, $http){
        //Registro de usuario
        $scope.user = {nombre:'', email:'', password:''};

        $scope.registrar = function(email, password){
            $http({method:'POST',
                url:'/cliente/registro/',
                data:$.param({nombre: $scope.user.nombre, email: $scope.user.email, password: $scope.user.password})
            }).then(
                function(response2){
                    window.location.href='';
                },function(response2){
                    $scope.user = response2.data || 'Request failed';
                }
            );
        }
    }])

Answered By - Emanuel Martínez Pinzón