Any views expressed within media held on this service are those of the contributors, should not be taken as approved or endorsed by the University, and do not necessarily reflect the views of the University in respect of any particular issue.

Migrating Laravel applications from EASE to EntraID (Azure)

This post will be about the upgrade process and the experience I had when moved our Laravel apps from Ease to EntraID.

 

Introduction

The University of Edinburg has made a decision to move away from EASE (Cosign) SSO users authentication to EntraID (Azure – Microsoft).
This meant to us that all the applications we developed over the years will have to be transitioned to use the new method.
At first this seemed like an easy procedure. Most of our apps are stored under shared hosting and we were advised to update the .htaccess file. That should be it.

Life is never that easy…

Some of our applications have a welcome page that is displayed before users log in. Some have authentication done on the Vue side. Users also can spend a lot of time “inactive” on one page which caused timoed out issues and data being lost.

We mostly use Laravel PHP framework in our development and this is how I overcame the mentioned issues.

Laravel Socialite

For systems that required a welocme page using Laravel’s Socialite package helped.

Applying the package is simple and well described in the documentation: https://laravel.com/docs/12.x/socialite. It also requires the Azure Socialite provider set up from: https://socialiteproviders.com/Microsoft-Azure/. This was the easiest and simplest solution. The only problem was to extract the users’ UUN as the provided Azure user was in an email format.

This also needs to have all the set up done on the Azure portal and a tutorial is available at: https://learn.microsoft.com/en-us/entra/identity-platform/quickstart-register-app.

And that is all, you don’t even have to update phpUnit tests.

Microsoft authentication library for JS

The other problem was with the Evaluation system where admin users spent a lot of time reading through the evaluations results. The timed out was set to 30 mins and it was still not enough for our users. If there were any changes set to the reports they were lost and the adminstrators had to start everyting again.

The Laravel’s Socialite plugin could not be used as the system was build with vue-auth plugin by websanova that is no longer maintained.
A fix for that was a much bigger and complicated change. I used https://github.com/AzureAD/microsoft-authentication-library-for-js to do the Vue authentication.

There were two parts for this update Laravel and Vue.

Laravel

For the Laravel part a new Middleware was created that controlled token verification. This is where all the magic happened.

First of all I needed to handle local environment properly so we could still work on the application in our dev environments. It was easy enough by simply reading the environment variable and bypassing the Azure authentication when it was not set to production.

The other part is where we have to authenticate users by uzing Azure token sent after the user logs in with Microsoft. It can be done with using another plugin https://github.com/firebase/php-jwt (A simple library to encode and decode JSON Web Tokens (JWT) in PHP). Microsoft provides public keys to decode Azure tokems at https://login.microsoftonline.com/common/discovery/v2.0/keys. You need to decode the token and comapre it against your endpoint which should contain your application Tennant ID (https://login.microsoftonline.com/AZURE_TENANT_ID).
If all is good the user details are returned and can be used to match against the local database.

 

The only problem I had wat that encryption algorithm was not set as Microsoft doesn’t add it by default so I had to manually set it.

 

This way we can protect api routes (routes–>api.php) by putting them under group middleware: Route::middleware([VerifyAzureToken::class])->group(static function () {…}
Laravel AuthController works as asupport for the Vue authentication and returns details about logogged in user.

 

Laravel unit tests

The unit test needed to be updated so they could also bypass the Azure authentication and his was done by simply calling $this->withoutMiddleware(\App\Http\Middleware\VerifyAzureToken::class); in each individual test.

 

Vue
The JS (Vue) part was much more complicated.

 

First of all the msalInstance had to be configured according to the Microsoft examples. The Vue router had to be updated for the proctected routes withrequiresAuth: true.

 

Some of the routes were only available to administrators so needed to add support for the requiresAuth param beeing an object and not just a boolean.
This is where Vue would check if the route is protected and then check if user has already been logged in then, if yes, ask Laravel for the user details through an api call. If all went well, another check if user has required roles and then process the request.

 

I also created global authUser property (with mixin) so I don’t have to load it on every component page where it is required. In there, I stored all extra authUser properties and metthods that were required by different applications like selected context for EMS system.

 

Another required JS file was the one to support login, logout and getToken methods. This was done by following the Microsoft examples and one thing worth mentioning is that you can set domain_hint parameter that allows you to directly jump to your organization login page skipping a general one.

You can also use two approach to the login/token refresh flow. One is by using a popup and another with redirect, ie: acquireTokenPopup and  acquireTokenRedirect. I still haven’t decided which one is better for our users but with popup one when the system needs to log you in again, you can do it in a separate window and the page you were working on stays on and any form data already inserted is not lost.

 

Those were simple changes but I faced some other issues to get the site working properly in development environment.
I fixed them using axios interceptors where I could discover the environment from the env file and bypass Azure authentication.

 

A very important setting is theaxios.defaults.withCredentials = true;. Simple addition but essential, otherwise nothing will work.

 

Another important note  is that await msalInstance.initialize();and  await msalInstance.handleRedirectPromise();have to be set before createApp call.

 

I aslo changed how Vue would handle error display to the console but this is not required. In my case, I also used axios interceptors and if the unrecognised error appear in the response I would display all its parts to the console for debugging.

Microsof Azure setup

Some extra changes were required on the Azure portal for the token excchange to work properly.

The app manifest has to be edited and have “accessTokenAcceptedVersion": 2, set.

To edit the manifest you need to got to the Manifest section in the left-hand-menu and select AAD Graph App Manifest (Deprecating Soon) tab. Edit the line and save the changes. Any edits in the Microsoft Graph App Manifest (New) tab will not have any effects.

Let’s summarize.

  1. Using htaccess protection works for simple applications where login is not required and the users are only browsing through pages.
  2. Using Laravel Socialite helps controlling the login flow and routes protection.
  3. Where the application uses JavaScript framework to control access to pages and uses API calls a Microsoft Azure JS library is required.

 

 

Share

Leave a reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

This site uses Akismet to reduce spam. Learn how your comment data is processed.

css.php

Report this page

To report inappropriate content on this page, please use the form below. Upon receiving your report, we will be in touch as per the Take Down Policy of the service.

Please note that personal data collected through this form is used and stored for the purposes of processing this report and communication with you.

If you are unable to report a concern about content via this form please contact the Service Owner.

Please enter an email address you wish to be contacted on. Please describe the unacceptable content in sufficient detail to allow us to locate it, and why you consider it to be unacceptable.
By submitting this report, you accept that it is accurate and that fraudulent or nuisance complaints may result in action by the University.

  Cancel