Developing SMART On FHIR Applications with Auth0 and InterSystems IRIS FHIR Server - Introduction
Tags: angular, fhir, oauth, programming
Published: 2024-05-29 15:13:42

<h2>Introduction</h2>
<p>I recently participated in a fantastically organized hands-on by @Patrick.Jamieson3621 in which an Angular application was configured together with an IRIS FHIR server following the protocols defined by SMART On FHIR and I found it really interesting, so I decided to develop my own Angular application and thus take advantage of what I learned to publish it in the Community.</p>
<h3>SMART On FHIR</h3>
<p>Let's see what Google tells us about SMART On FHIR:</p>
<blockquote>
<p>SMART on FHIR is a data standard that allows applications to access information in electronic health record (EHR) systems. An application developer can write a single application that connects to any EHR system that has adopted the standard.</p></blockquote>
<p>The main concepts that we are going to handle in SMART On FHIR are:</p>
<ul>
<li>Delegated authentication and authorization by OAuth2 or OpenID.</li>
<li>Management of FHIR resources in the defined context.</li>
<li>HTTPS communications.</li>
</ul>
<h2>Architecture of our project</h2>
<p>For this exercise we have configured the following elements in both Docker and the Auth0 service:</p>

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mitoz3s6uqee1gfpht49.png)
<ul>
<li>One application developed in Angular that will act as our front-end, this application has been developed following the principles of SMART On FHIR.</li>
<li>NGINX web server and reverse proxy that will publish our application developed in Angular.</li>
<li>Auth0 will provide us with the authentication and authorization service through OAuth2.</li>
<li>InterSystems IRIS in which we will deploy our FHIR server and to which we will connect through the Web Gateway which includes an Apache Server already available in its Docker image.</li>
</ul>
<h2>Auth0</h2>
<p>Although we could delegate the authentication and authorization of users to another IRIS server deployed for this purpose, on this occasion we are going to use the service offered by <a href="http://auth0.com/" target="_blank">Auth0</a>.</p>
<p>What is Auth0?</p>
<blockquote>
<p><em>Auth0 is a service that provides us with the entire mechanism to manage authorization and authentication of our platforms.</em></p></blockquote>
<p>Auth0 also has specific libraries in different languages to be able to easily integrate with any project, so it is always an option to take into account for developments based on SMART On FHIR.</p>
<h2>Including Auth0 in our application.</h2>
<p>Since the use of OAuth2 is a required condition for the use of SMART On FHIR, this implies the inclusion of an OAuth2 server in the usual process of authentication, authorization and access to the application. In the following diagram we can see the path taken by the information sent to the system with the Auth0 service:</p>

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/41fo54wgrg9ghz4vi7xy.png)
<p>Let's analyze the process:</p>
<ul>
<li>Login request:
<ol>
<li><strong>Login request</strong>: The user accesses the application in their Internet browser and requests to log in.</li>
<li><strong>Login request</strong>: The Angular application forwards the request to the Auth0 service.</li>
<li><strong>Login page</strong>: Auth0 sends a redirect to your own page to the user's Internet browser.</li>
</ol></li>
<li>Authentication on Auth0:
<ol>
<li><strong>User credentials</strong>: The user enters their email and the password with which they are registered in Auth0.</li>
<li><strong>Authentication &amp; Authorization</strong>: Auth0 validates the data and generates an Access_token including the context assigned to the user.</li>
<li><strong>Access_token response &amp; redirection</strong>:&nbsp;Auth0 redirects the response to the URL indicated in the project configuration including the generated token.</li>
<li><strong>Patient screen</strong>: The Angular application shows the user the page to register their personal data.</li>
</ol></li>
<li>FHIR Resource Record:
<ol>
<li><strong>Save patient</strong>: the user fills out the form with her data and the Angular application transforms the form into a JSON object in the format of the FHIR Patient resource.</li>
<li><strong>POST request</strong>: the Angular application sends an HTTP POST call to the FHIR server deployed in IRIS including the access_token as an authentication token in the request header.</li>
<li><strong>POST response</strong>: after receiving the POST request via Web Gateway, IRIS checks the validity of the token and the context of the request. If everything is correct, it will validate the resource received and register it on the FHIR server, returning an HTTP 201 indicating the creation of the new resource. and attaching in a header the identifier assigned to the new resource.</li>
<li><strong>Operation success</strong>: The Angular application will redirect the user to the screen showing the main functionalities.</li>
</ol></li>
</ul>
<p>Once logged in, the Auth0 library included in the project will be in charge of intercepting all the requests we make to our FHIR server to include the access token received from Auth0.</p>
<h2>Coming soon...</h2>
<p>In the next articles we are going to see how we have to configure each of the systems involved and finally how to connect it with our Angular application. For those of you who cannot wait, you can consult the README.md present on the GitHub associated with the OpenExchange project linked to this article, which explains in detail how to configure both Auth0 and InterSystems IRIS.</p>

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f37n5pxlxm9a7o9kpaad.jpg)