Why is my Angular Web app hosted on Azure web.config file not working?

Question

I have my Angular app hosted on Azure. I'm trying to redirect access to my /assets/vid/ folder. But nothing happens when I try to go to www.example.com/assets/vid/test.mp4 . It just opens the file.

This is my web.config file, it's placed inside src folder and have it added in my angular.json to "assets".

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
            <rule name="Videos Reroute" stopProcessing="true">
                <match url="(.*)/(assets/vid/.*.mp4)$"  />
                <action type="Rewrite" url="/"  />
            </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

Answer 1

you can try these blew code.

<rewrite>
            <rules>
                <rule name="Videos-Reroute" stopProcessing="true">
                    <match url="[123.png]" />
                    <conditions logicalGrouping="MatchAny">
                        <add input="{REQUEST_FILENAME}" pattern="/*\.png$"/>
                    </conditions>
                    <action type="Rewrite" url="https://google.com" />
                </rule>
            
                <rule name="File-Folder" stopProcessing="true">
                    <match url="[321.txt]" />
                    <conditions logicalGrouping="MatchAny">
                        <add input="{REQUEST_FILENAME}" pattern="/*\.txt$"/>
                    </conditions>
                    <action type="Rewrite" url="https://google.com?search?q=c#" />
                </rule>
            </rules>
        </rewrite>