How to make virtual directory part of the URL in IIS case insensitive for the Angular app?

Question

I know IIS is supposed to be case insensitive. However angular app handles the base href part of the URL case sensitive which means IIS should change the URL's base href-part to correct format before the angular app is involved.

So I have base href defined as:

myapp

and

import { Location } from '@angular/common';
// ...
private location: Location

With lots of trial and error with angular app I could not get

this.location.path()

to work properly with both URLS:

myapp/login

and

myApp/login

where myapp is the base href. The latter of the urls above is returned as myApp/login and not login by

this.location.path()

So I would like to create a rewrite rule in IIS that handles virtual directory / base href case insensitively and the angular app sees always urls like 'login' and not 'myApp/login'.

However IIS URL rewrite rules seem to be only for the part AFTER the virtual directory / base href.

What can I do? As I said, solving this in IIS only would be the best option. The other option where base href is handled in angular app might be possible but without hardcoding it in the app i was not able to get it to work.

Jalpa Panchal Jalpa Panchal · Accepted Answer · 2020-08-07T02:40:13

IIS is not case sensitive.you have to do the coding in the angular app. the only way you could try in is iis URL rewrite rule to convert URL in upper case or lower case. below is the sample rule:

<rewrite>
    <rules>
        <rule name="LowerCaseRule1" stopProcessing="true">
            <match url="([A-Z].*)" ignoreCase="false" />
            <action type="Redirect" url="{ToLower:{URL}}" />
        </rule>
    </rules>
</rewrite>

How to make virtual directory part of the URL in IIS case insensitive for the Angular app?

1 Answers