Cross-origin redirection denied by CORS policy: Cancelled load because it violates the resource's CORS response header

Get Help
,
22

Hi Nik,

Most of the code related to logging in/out can be found in program.cs, which is posted above. The triggering links are as follows:

        <AuthorizeView>
            <Authorized>
                <div class="nav-item px-3">
                    <NavLink class="nav-link" href="account/logout">
                        <span class="bi bi-terminal-fill" aria-hidden="true"></span> Logout
                    </NavLink>
                </div>
            </Authorized>
        </AuthorizeView>

        <AuthorizeView>
            <NotAuthorized>
                <div class="nav-item px-3">
                    <NavLink class="nav-link" href="account/login">
                        <span class="bi bi-terminal" aria-hidden="true"></span> Login
                    </NavLink>
                </div>
            </NotAuthorized>
        </AuthorizeView>

This is pretty standard fare for building a Blazor menu structure. It was suggested that I replace these with HTML anchors - there was no change.

As for the custom domain, it is Auth0-managed. As I recall, I didn’t have the option to do otherwise, and can’t change it now without rebuilding the custom domain and DNS record. The CORS headers currently reside in program.cs.

Aside from post-login processing, you have all of the code related to logging in/out in this thread.

David

23

Could you try the following code for your triggering links:

<AuthorizeView>
    <Authorized>
        <div class="nav-item px-3">
            <a class="nav-link" href="account/logout" target="_top">
                <span class="bi bi-terminal-fill" aria-hidden="true"></span> Logout
            </a>
        </div>
    </Authorized>
</AuthorizeView>

<AuthorizeView>
    <NotAuthorized>
        <div class="nav-item px-3">
            <a class="nav-link" href="account/login" target="_top">
                <span class="bi bi-terminal" aria-hidden="true"></span> Login
            </a>
        </div>
    </NotAuthorized>
</AuthorizeView>

The reason why I recommend switching to standard <a> anchors is to pass in the target="_top" attribute in order to force the browser to perform a “Top Level Navigation” which is not being intercepted by your Blazor Router without breaking the COOP isolation context and security.

Let me know if this works.

Kind Regards,
Nik

24

Hi Nik,

We have a winner! The code now works as expected.

Thank you very much for your time,

David

25

Glad to know that did the trick @david42!

Sorry for taking this long to find the exact cause but we needed to make sure the most probable causes for the cross-origin isolation error would be addressed. In the end, it appears that the Blazor Router was the culprit all along (since it likes to intercept server-side links or external navigations - as it is expected to) because it was not handling the redirection to Auth0 accordingly in the context of CORS CO isolation.

This can be expected with strict CORS headers but it did take some time to narrow everything down!

I would recommend to double check the entire login flow to make sure that the application functions as expected and that the context of CO isolation is not broken or interrupted during the entire flow. The recommended code above for your navigation menu should not affect the CORS policy initialized by your applications, it should be considered a workaround or a flow which “breaks” the COOP context in order to allow the redirect to succeed while not having opened any security risks.

If I can help with anything else, let me know!

Kind Regards,
Nik