在 Angular 应用程序中使用 $http 发送 mojolicious 会话 cookie答案

【问题标题】：send mojolicious session cookie with $http in angular app在 Angular 应用程序中使用 $http 发送 mojolicious 会话 cookie
【发布时间】：2014-10-24 19:45:31
【问题描述】：

我希望 Angular ($http) 发出的 GET 请求包含会话 cookie。我虽然包括$httpProvider.defaults.withCredentials = true; 就足够了。不过，没有任何请求包含 cookie。

我有一个 mojolicious 应用程序服务于一个 Angular 应用程序。 Mojolicious 公开了一个登录 API：

POST 验证
GET 指示会话是否仍然有效（如果良好则返回带有值的名称，否则返回 null）。

会话 cookie 需要包含在 GET 请求中。 这是如何在 Angular 中实现的？

» curl localhost:3000/login -d '{"user": "test", "password": "pswd"}' -c cookie.txt
{"login":1,"name":"test"}

» curl localhost:3000/login -b cookie.txt
{"name":"test"}

» curl localhost:3000/login 
{"name":null}

» cat cookie.txt
# Netscape HTTP Cookie File
# http://curl.haxx.se/docs/http-cookies.html
# This file was generated by libcurl! Edit at your own risk.

#HttpOnly_localhost FALSE   /   FALSE   1414178938  lncddbv3    eyJleHBpcmVzIjoxNDE0MTc4OTM4LCJ1c2VyIjoidGVzdCJ9--7fa22efde0d87e7d79f2d29d7adb97ab92f632c4

客户端：

<html lang="en">
<head>
  <title>login test</title>
  <script type="text/javascript" src="lib/jquery-1.11.0.min.js"></script>
  <script type="text/javascript" src="lib/angular.js"></script>
  <script type="text/javascript" src="bower_components/angular-cookies/angular-cookies.js"></script>
  <script>
    var URL='http://localhost:3000/';

    angular.module('loginTest',['ngCookies'])
        .config(function($httpProvider) {
          $httpProvider.defaults.withCredentials = true;
        })

    angular.module('loginTest')
      .controller('loginCtrl',function loginCtrl($scope,$http){

         // is our session valid?
         $scope.isvalid = function() {
              $http({
                 url: URL+'login/',
                 method:"GET",
                 headers: {'Content-Type': 'application/json'},
                })
               .success(
                 function(data){
                   console.log('isvalid',data);
                   $scope.validname = data.name;
                });
         };

         // authenticate session
         // call isvalid on success
         $scope.auth = function(){
              $http({
                 url: URL+'login/',
                 method:"POST",
                 headers: {'Content-Type': 'application/json'},
                 dataType: 'json',
                 data: {user: "test", password: "pswd" }
              })
              .success(
                 function(data){
                   console.log('login', data);
                   $scope.authname = data.name;
                   $scope.isvalid()
                 }
              );
            };

       // try both. auth calls valid
       $scope.auth()
      });

  </script>
</head>
<body ng-app="loginTest">
 <div ng-controller="loginCtrl">
   <button ng-click="auth()">auth</button> 
   <button ng-click="isvalid()">valid?</button> <br>
   auth as: "{{authname}}";<br>
   valid as: "{{validname}}"
 </div>
</body>
</html>

在浏览器+firebug中看到的：

身份验证 API：

  ## use angular files
  push @{$self->static->paths}, $self->home->rel_dir('../angular/');

  ## routes
  my $r=$self->routes;
  $r->get ('/login')->to('login#isLogin');
  $r->post('/login')->to('login#login');

  #### Login.pm
  sub login {
   my $self=shift;
   my $json =decode_json($self->req->body || '{}');
   $self->session(user => $json->{user}) 
          if($json->{user} eq "test" && $json->{password} eq "pswd");

  }

  sub isLogin {
   my $self = shift;
   $self->render(json => {name=>$self->session('user') } );
  }

  ####

【问题讨论】：

标签： angularjs perl session-cookies mojolicious

【解决方案1】：

使用localhost.localdomain 或127.0.0.1 而不是localhost。

Cookie 会针对有效域的所有请求发送。一个有效的域名至少需要一个点。

Cookies on localhost with explicit domain

【讨论】：