Friday 17 July 2020

MSAL localhost

So let's say that you have MSAL configured and it works perfectly in production however it fails in your development (localhost) environment. As a matter of fact you get a javascript error message such as the following.

Unsafe JavaScript attempt to initiate navigation for frame with origin '' from frame with URL 'http://localhost:8080/login'. The frame attempting navigation is neither same-origin with the target, nor is it the target's parent or opener.

well my dear friend odds are you most likely made the same bonehead move that I did, especially if on your older laptop it worked perfectly, but fails on your new one. I'll cut to the chase, you need to specify the correct redirect url when defining your IdentityContext:

  IdentityServicenew IdentityService(
    new IdentityContext(

as you can most like deduce i am using vue.js environment variables to hold my values, but you know which files do not get pushed to your repo, the ones that end in .local, and which ones does your local machine use? the ones that end in .local. 

trust me if this solved your problem you are feeling a lot less silly than I did when I figured it out.

all i had to do was open my file


and change it to


and all was well in the world again