Dancer2 Session & Authentication and AngularJS

This took me too much to figure out from different sources hence jotting down my recipe. My application is called ADA ... here the main part with login / logout

package Ada;
use Dancer2;
use Dancer2::Session::Simple;
use Dancer2::Plugin::Auth::Tiny;

our $VERSION = '0.1';

# Authentication Requires Session, here the in memory
set session => "Simple";
#set session => 'YAML';

hook before => sub {
  printf "logged in? %s\n", session('user') ? session('user') : '-';
  if ( !session('user') && request->dispatch_path !~ m{^/login} ) {
    forward '/login', { requested_path => request->dispatch_path };
  }
};

get '/' => sub {
  template 'index';
};

get '/login' => sub {

  # Display a login page; the original URL they requested is available as
  # param('requested_path'), so could be put in a hidden field in the form
  template 'login', { path => param('requested_path') };
};

post '/login' => sub {
  if ( _is_valid( param('user'), param('pass') ) ) {
    print "logged on success!\n";
    session user => param('user');
    redirect param('path') || '/';
  }
  else {
    redirect '/login?failed=1';
  }
};

sub _is_valid {
  my ( $u, $p ) = @_;
  my $store = schema 'default';
  foreach my $r ( $store->resultset('PmiUser')->all ) {
    printf "%10s = %s\n", $r->fedex_id, $r->fedex_pw;
  }
  my $rec =
    $store->resultset('PmiUser')
    ->find( { 'id' => $u, 'pwd' => $p } );
  printf $rec->fedex_id;
  return $rec and $rec->fedex_id ? 0 : 1;
}

get '/logout' => sub {
  printf( "logging out %s\n", session('user') ? session('user') : '-' );
  context->destroy_session;
  redirect '/';
};

true;

project layout

.
├── Gruntfile.js
├── MANIFEST
├── MANIFEST.SKIP
├── Makefile.PL
├── app
│   ├── 404.html
│   ├── favicon.ico
│   ├── fonts
│   ├── images
│   │   └── yeoman.png
│   ├── index.html
│   ├── robots.txt
│   ├── scripts
│   │   ├── app.js
│   │   ├── controllers
│   │   │   ├── main.js
│   │   └── services
│   │       ├── lookups.js
│   ├── styles
│   │   └── main.css
│   ├── test
│   │   └── spec
│   │       └── services
│   │           └── lookups.js
│   └── views
│       └── main.html
├── bin
│   └── app.pl
├── bower.json
├── config.yml
├── environments
│   ├── development.yml
│   └── production.yml
├── karma-e2e.conf.js
├── karma.conf.js
├── lib
│   └── Ada.pm
├── out
├── package.json
├── run.sh
├── t
│   ├── 001_base.t
│   └── 002_index_route.t
├── test
│   ├── runner.html
│   └── spec
│       ├── controllers
│       │   ├── main.js
│       └── services
│           ├── lookups.js
│           └── wls-domain-service.js
└── views
    ├── index.tt -> ../app/index.html
    ├── layouts
    │   ├── main.tt -> ../../app/index.html
    │   └── navbar.tt
    └── login.tt

config.yml

# This is the main configuration file of your Dancer2 app
# env-related settings should go to environments/$env.yml
# all the settings in this file will be loaded at Dancer's startup.

# Your application's name
appname: "ada"

# when the charset is set to UTF-8 Dancer2 will handle for you
# all the magic of encoding and decoding. You should not care
# about unicode within your app when this setting is set (recommended).
charset: "UTF-8"

# template engine
# simple: default and very basic template engine
# template_toolkit: TT
serializer: JSON
session: YAML
session_dir: /tmp/dancer-sessions

template: "template_toolkit"
engines:
  JSON:
    allow_blessed:   '1'
    canonical:       '1'
    convert_blessed: '1' 
  template_toolkit:
    encoding:  'utf8'
    start_tag: '[%'
    end_tag:   '%]'
    WRAPPER: layouts/main.tt
    EVAL_PERL: '1'
  Auth::RBAC:
    credentials:
        class: Config
        options:
            accounts:
                  user01:
                      password: foobar
                      roles:
                          - guest
                          - user
                  weblogic:
                      password: wladmin1
                      roles:
                          - admin

angularjs - index.tt

Add the Logout function to your navigation pills.... make sure its a href.

  <!-- Add your site or application content here -->
  <div class="header">
    <ul class="nav nav-pills pull-right">
      <li class="active"><a ng-href="#">Home</a></li>
      <li><a href="./logout">Logout</a></li>
    </ul>
    <h3 class="text-muted">AD Assistant</h3>
  </div>

login.tt

A very simple ugly login screen.

<html>
      <head>
        <title>Session and logging in</title>
      </head>
      <body>
        <form action='/login' method='POST'>
            User Name : <input type='text' name='user'/>
            Password: <input type='password' name='pass' />

            <!-- Put the original path requested into a hidden
                       field so it's sent back in the POST and can be
                       used to redirect to the right page after login -->
            <input type='hidden' name='path' value='[% path %]'/>

            <input type='submit' value='Login' />
        </form>
      </body>
</html>

Angular ng-enter Directive

Just copied it from somewhere to keep for myself .. I mostly put it in the app.js at the bottom so everyone is able to use this function.

.directive('ngEnter', function() {
 return function(scope, element, attrs) {
  element.bind("keydown keypress", function(event) {
   if (event.which === 13) {
    scope.$apply(function() {
     scope.$eval(attrs.ngEnter, {
      'event' : event
     });
    });

    event.preventDefault();
   }
  });
 };
});

Dancer2 and changing server port

Well the --port does not work... keeps it on 3000 also set port does not work...

#!/usr/bin/env perl
use Dancer2;
set port => '3010';
use lib './lib';
use Data::Dumper;
dance;

does not work... What to do ??? Here the magic environment variables...

sub _build_default_config {
    my $self = shift;

    $ENV{PLACK_ENV}
      and $ENV{DANCER_APPHANDLER} = 'PSGI';

    return {
        apphandler   => ( $ENV{DANCER_APPHANDLER}   || 'Standalone' ),
        content_type => ( $ENV{DANCER_CONTENT_TYPE} || 'text/html' ),
        charset      => ( $ENV{DANCER_CHARSET}      || '' ),
        warnings     => ( $ENV{DANCER_WARNINGS}     || 0 ),
        startup_info => ( $ENV{DANCER_STARTUP_INFO} || 1 ),
        traces       => ( $ENV{DANCER_TRACES}       || 0 ),
        logger       => ( $ENV{DANCER_LOGGER}       || 'console' ),
        host         => ( $ENV{DANCER_SERVER}       || '0.0.0.0' ),
        port         => ( $ENV{DANCER_PORT}         || '3000' ),
        views        => ( $ENV{DANCER_VIEWS}
              || path( $self->config_location, 'views' ) ),
        appdir        => $self->location,
    };
}

So specify your bin/app.pl like this

#!/usr/bin/env perl

BEGIN {
  $ENV{'DANCER_PUBLIC'}            = './app';
  $ENV{'DBIC_TRACE'}               = 1;
  $ENV{'DANCER_PORT'}              = 3010;
  $ENV{'DBIC_NULLABLE_KEY_NOWARN'} = 1; # allowing nulls in uniq constraints
}
use Dancer2;
set port => '3010';
use lib './lib';
use myapp;
dance;