Power Pages Update Last Successful Login Using JavaScript and Power Pages API

 Recently while working on a Power Pages implementation for a client, I had the requirement to show the last time a user logged in on their profile page.  I thought this would be easy to do as there is already a field on the contact record for "Last Successful Login" (      adx_identity_lastsuccessfullogin).  This use to update when a user logged in, but it appears Microsoft has removed that automation.

While searching I came across a few different ways of achieving this task.  One used application insights in Azure and another one used an HTTP endpoint setup in Power Automate.  I thought, this needs to be simpler.  What I came up with is to use Liquid with JavaScript to tell if a user is logged in or not.  Then use the new Power Pages api to update the logged in users contact record to mark the last time they logged in.

Here is the approach I setup:

1) Make sure you turn on the api for contact in Site Settings.

1) Link to Microsoft Doc On How to turn on the api

2) Make sure you include "adx_identity_lastsuccessfullogin" in the list of fields to return.

2) I tested my process on the home page.  On the home page add two JavaScript Functions.  The first function (CheckIfUserJustLoggedIn) uses Liquid to tell if the user is logged in.  If they are not, it deletes our value from session memory.  If the user is logged in we check session memory to see if there is already a key in there with the date and time the user logged in.  If there is, we don't do anything else.  If there isn't then we create it and we update the contact record for the user via the Power Pages API.  The second function is Microsoft's wrapper function that handles the Ajax call and handles the authentication piece to make sure the user is authorized to perform the option.

1:  function CheckIfUserJustLoggedIn()  
2:  {  
3:    var sessionLastLogin = "sessionLastLogin";  
4:    var isLoggedIn = "{% if user %}true{% else %}false{% endif %}";  
5:    if (isLoggedIn == 'true')  
6:    {  
7:      var userId = "{{user.id}}";  
8:      userId = userId.replace('{', '').replace('}', '');  
9:      var lastLogin = sessionStorage.getItem(sessionLastLogin);  
10:      if (lastLogin == null)  
11:      {  
12:        var dateTimestamp = new Date();  
13:        sessionStorage.setItem(sessionLastLogin, dateTimestamp);  
14:        webapi.safeAjax({  
15:          type: "PATCH",  
16:          url: "/_api/contacts(" + userId + ")",  
17:          contentType: "application/json",  
18:          data: JSON.stringify({  
19:            "adx_identity_lastsuccessfullogin": dateTimestamp  
20:          }),  
21:          success: function (res) {  
22:            console.log(res);  
23:          }  
24:        });  
25:      }  
26:    }  
27:    else  
28:    {  
29:      sessionStorage.removeItem(sessionLastLogin);  
30:    }  
31:  }  

1:  (function(webapi, $){  
2:    function safeAjax(ajaxOptions) {  
3:        var deferredAjax = $.Deferred();  
4:        shell.getTokenDeferred().done(function (token) {  
5:            // add headers for AJAX  
6:            if (!ajaxOptions.headers) {  
7:                $.extend(ajaxOptions, {  
8:                    headers: {  
9:                        "__RequestVerificationToken": token  
10:                    }  
11:                });  
12:            } else {  
13:                ajaxOptions.headers["__RequestVerificationToken"] = token;  
14:            }  
15:            $.ajax(ajaxOptions)  
16:                .done(function(data, textStatus, jqXHR) {  
17:                    validateLoginSession(data, textStatus, jqXHR, deferredAjax.resolve);  
18:                }).fail(deferredAjax.reject); //AJAX  
19:        }).fail(function () {  
20:            deferredAjax.rejectWith(this, arguments); // on token failure pass the token AJAX and args  
21:        });  
22:        return deferredAjax.promise();  
23:    }  
24:    webapi.safeAjax = safeAjax;  
25:  })(window.webapi = window.webapi || {}, jQuery)  

If you run into issues for permissions check your Power Pages Web Roles table and make sure the user has the correct permissions for the contact table.