Samantha J Samantha J - 1 month ago 7
AngularJS Question

How can I handle email confirmation URLs in an Identity 2.1 SPA Angular JS Application?

I have seen an example that uses MVC. It has a return URL which comes up with a screen that is called from the email sent out. But I have an SPA AngularJS application so it is a bit different. Has anyone tried to do this with a SPA and if so how did they go about implementing it. Any pointers would be much appreciated.

Answer

I'm working on the same now; needs more work to make it pretty and whatnot, but hopefully you get the general idea.

The confirmation URL looks like:

http://localhost:8000/app.html#/confirm/9a28aa89e84e80153b1f2083d38911acbae12e8365dd13c83cee55f79481e1f8

(localhost:8000 because I'm testing). I then have a route for ui-router:

var confirm = {
    name: 'confirm',
    url: '/confirm/:auth',
    templateUrl: 'app/front/partial/confirm.html',
    params: {auth: {}}
    } ;
$stateProvider.state(confirm) ;

the confirm.html partial (which obviously needs fleshing out a bit!) is:

<div ng-controller="Fapi.Front.Confirm.Ctrl">
  CONFIRM
</div>

and the controller is:

angular.module('myApp')
    .controller('App.Front.Confirm.Ctrl', [
        '$scope', '$state', '$stateParams', 'toaster', 'MyDataService',
        function ($scope, $state, $stateParams, toaster, MyDataService) {
            MyDataService.confirm (
                {auth: $stateParams.auth},
                function (data) {
                    toaster.pop('success', 'Your registration has been confirmed') ;
                    setTimeout(function () { $state.go('login') }, 5000) ;
                    },
                function (data) {
                    toaster.pop('error', data.message) ;
                    }
                )
        }]) ;

MyDataService is just a service that wraps $http calls to the server.

So, instead of the 'usual' situation where the URL invokes a script on the server which does the work, and then renders a 'you have been confirmed' (or not) page, here the router takes the browser to a page that then makes an AJAX call to the server to do the confirmation.

Comments