Angular HTTP發布未將數據傳遞到Django視圖

Question

我正在嘗試使用有角度的$ http發布數據到django視圖，但是沒有發生。 每次傳遞數據時，它顯示為空dict，這意味着我沒有正確使用POST請求。 我是集成django和angular應用程序的新手，所以如果有人可以幫助我，這將是很棒的。

app.js

vm.login = function() {
            vm.authMsg = '';
            var login_data = {'username': vm.account.username, 'password': vm.account.password};

            if(vm.loginForm.$valid) {

              $http
                .post('/login_app/', {login_data:JSON.stringify(login_data)})
                .then(function(response) {
                   console.log(login_data);

                  if ( !response.login_data ) {
                    vm.authMsg = 'Incorrect credentials.';
                    // vm.authMsg = response;
                  }else{
                    $state.go('app.dashboard');
                  }
                }, function() {
                  vm.authMsg = 'Server Request Error';
                });
            }
            else {
              vm.loginForm.account_username.$dirty = true;
              vm.loginForm.account_password.$dirty = true;
            }
          };

views.py

def login_app(request):
    if request.method == 'POST':
        print request.POST
        username = request.POST.get('username')
        password = request.POST.get('password')

        print 'username', username
        print 'password', password
        user = authenticate(username=username, password=password)
        print 'user', user
        if user:
            if user.is_authenticated():
                print 'user authenticate'
                login(request, user)
                return HttpResponse(json.dumps({}), content_type='application/json')
        else:
            return HttpResponse('<h1>Access Denied.<br>Wrong Credentials.</h1>')

login.html

<form role="form" ng-submit="login.login()" name="login.loginForm" novalidate="" class="form-validate mb-lg" method="post">

            <div class="form-group has-feedback">
               <input id="exampleInputUsername1" type="text" name="account_username" placeholder="Enter username" autocomplete="off" ng-model="login.account.username" required="" class="form-control" />
               <span class="fa fa-envelope form-control-feedback text-muted"></span>
               <span ng-show="login.loginForm.account_username.$dirty &amp;&amp; login.loginForm.account_username.$error.required" class="text-danger">This field is required</span>
            </div>
            <div class="form-group has-feedback">
               <input id="exampleInputPassword1" type="password" name="account_password" placeholder="Password" ng-model="login.account.password" required="" class="form-control" />
               <span class="fa fa-lock form-control-feedback text-muted"></span>
               <span ng-show="login.loginForm.account_password.$dirty &amp;&amp; login.loginForm.account_password.$error.required" class="text-danger">This field is required</span>
            </div>
            <div class="clearfix">
               <div class="checkbox c-checkbox pull-left mt0">
                  <label>
                     <input type="checkbox" value="" name="account_remember" ng-model="login.account.remember" />
                     <span class="fa fa-check"></span>Remember Me</label>
               </div>
               <div class="pull-right"><a ui-sref="page.recover" class="text-muted">Forgot your password?</a>
               </div>
            </div>
            <button type="submit" class="btn btn-block btn-primary mt-lg">Login</button>
         </form>

urls.py

from django.conf.urls import patterns, url
from login import views

urlpatterns = patterns('',
                    url(r'^$',views.home, name='home'),
                    url(r'^login_app/$',views.login_app, name='login_app'),
                    )

Answer 1

嘗試這個。

如果您不對login_data進行包裝/ JSON化，則您現有的視圖應該可以將其解壓縮。 我很確定angular會自動處理json轉換，但是django不會。

vm.login = function() {
        vm.authMsg = '';
        var login_data = {'username': vm.account.username, 'password': vm.account.password};

        if(vm.loginForm.$valid) {

          $http
            .post('/login_app/', login_data)
            .then(function(response) {
               console.log(login_data);
            [...]

看起來您還想查看request.body以獲取json數據。 如果您的Django <1.4，則有所不同。

def login_app(request):
    if request.method == 'POST':
        print request.body
        data = json.loads(request.body)
        print data
        username = data.get('username')
        password = data.get('password')
        [...]