Scriptmanager issue because of rewrite rule in web.config for angularjs

Question

I have an angulajs application which implements routing as

.config(function ($routeProvider, $locationProvider) {
            $routeProvider
                .when("/home", {
                    templateUrl: "home.html",
                    controller: "homeController"
                })
                .when("/filter", {
                    templateUrl: "filter.html",
                    controller: "filterController"
                })

and i have a rewrite rule in asp.net web.config as follows as suggested here--SO

<rewrite>
  <rules>
    <rule name="AngularJS" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
      </conditions>
      <action type="Rewrite" url="/webmasterpage.html" />
    </rule>
  </rules>
</rewrite>

to make routing work in asp application, but because of the rewrite rule i am facing

Unexpected token < error in WebResource.axd and ScriptResource.axd

and also

ASP.NET Ajax client-side framework failed to load error for asp:scriptmanager

if i comment out rewrite rule in web.config file this error goes away but angularjs routing wont work! In what way we could write the rewrite rule so that we get both (asp scriptmanager and angularjs routing) working fine. any help is appreciated

score 1 · Accepted Answer · answered Jul 25 '18 at 07:13

So after googling a lot finally i was able to break through the same. sharing my answer here so it could help somebody in future. so i configured the rules for angular in web.config file as follows :

 <rewrite>
  <rules>
    <rule name="AngularJS" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.html$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.js$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.css$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.aspx$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.axd$" negate="true" />
      </conditions>
      <action type="Rewrite" url="/webmasterpage.html" />
    </rule>
  </rules>
</rewrite>

you can note here

        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.html$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.js$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.css$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.aspx$" negate="true" />
        <add input="{REQUEST_FILENAME}" pattern="(.*?)\.axd$" negate="true" />

I have specifically mentioned file extensions which I want to load and get accessed exclusively. the .axd was getting generated on the fly by asp and was not getting loaded, so after getting listed specifically in rules it is now getting loaded. I don't know much technicalities but this is what worked for me and i am sure will help somebody else too. :)

It is also useful for environments with: ScriptResource.axd, WebResource.axd, bootstrap, jquery, Telerik components... modified to remove the .aspx extension but not the rest in my case. thanks — mainmind83, Mar 03 '22 at 10:53

Scriptmanager issue because of rewrite rule in web.config for angularjs

1 Answers1