Communication between web app frontend and backend (authentication)

Question

Communication between web app frontend and backend (authentication)

Cloud Texavie 71

Hi,

I have deployed MERN stack web application using two different app service web app for the frontend (React) and the backend (Nodejs), each setup for continuous integration with a separate Github repo. As the frontend and backend are running on different domains, none of the functionalities involving cookies (e.g sending refresh tokens from the backend to the frontend) can be used. Would you have any recommendation on how to :

Either deploy the frontend and backend on the same domain (so cookies can be used) without having to merge the code for both into a single repository
Perform cross-domain authentication in a secure manner

Thanks

1 answer

Your answer

Answer 1

Ryan Hill 30,281 Microsoft Employee Moderator

Hi @Cloud Texavie ,

You have some options at your disposal for setting up communication between your frontend and backend applications. One option is to restrict access to your backend Node app by adding both App Services to a Virtual Network and allowing the backend app to only see traffic on that VNET. If you don't want to restrict traffic, you can certainly enable authentication between both App Services through Bearer tokens through CORS. Below I've listed some docs that will help point you in the right direction.

Cloud Texavie 71 Reputation points

2021-04-04T02:36:51.56+00:00

Thank you for this answer! Just as a quick clarification, the authentication mentionned is for the users/clients, so it would still be necessary to send access tokens from the backend to the frontend even if they were running inside a VNET in my use case.
I would thus need to switch from cookies to Bearer tokens if the frontend and the backend are deployed on separate App Services, is that right ?
Ryan Hill 30,281 Reputation points Microsoft Employee Moderator

2021-04-06T00:06:09.547+00:00

If your backend will be in a VNet that will be restricted to traffic only on that VNet, then you won't need to pass a bearer token to your backend app. You can ensure that clients connected to your front end must be authenticated before executing a request to your backend.
Cloud Texavie 71 Reputation points

2021-04-06T17:09:04.403+00:00

I understand, thank you for this response. I am referring mainly to tokens to access protected resources on the backend for e.g (authorization service) as the business logic and interactions with the database happen in the backend. Wouldn't I still need to pass an access token to check for user identity and roles even if the backend were to run inside a VNET with restricted traffic ?
Ryan Hill 30,281 Reputation points Microsoft Employee Moderator

2021-04-06T21:17:27.07+00:00
Not necessarily because architecturally, the front-end is the client of the backend app service.

Having said that, say you did want to pass access token. The service principal of the front-end app would be the user and the identity of said principal would be validated against AAD, provided a token, and passed from the front-end to the back-end.

https://learn.microsoft.com/en-us/azure/app-service/overview-managed-identity?tabs=dotnet

https://learn.microsoft.com/en-us/azure/app-service/app-service-web-tutorial-connect-msi

Share via

Communication between web app frontend and backend (authentication)

1 answer

Your answer