CODEWITHSUNDEEP
javascripthtmlangularjsiisurl-rewriting
Sankar
Sankar

Reputation: 7107

AngularJS Routing in IIS

I have developed the angularJs application which is hosted in the IIS root i.e) I make it run in Localhost. If i type localhost in browser and hit enter, my application is opened and works perfectly.

The problem is, I have some other applications concurrently running under localhost. For ex) localhost/hris, localhost/CMS etc., those are asp.net applications. After I hosted the angular app, if try to open my application it shows me the below javascript error in browser console...

Uncaught Error: ASP.NET Ajax client-side framework failed to load.
ScriptResource.axd:1 Uncaught SyntaxError: Unexpected token <

I got this two errors multiple times...

How do i overcome this?

FYI:- I have implemented routing in my angular app. One more thing is URL Rewrite, I have it as below in my web.config...

<rewrite>
    <rules>
        <rule name="AngularJS Routes" 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_URI}"  pattern="api/(.*)" negate="true" />
            </conditions>
            <action type="Rewrite" url="/" />
        </rule>
    </rules>
</rewrite>

I'm a very beginner for angularJS.

Anybody help me on this...

Thanks in advance...

Upvotes: 0

Views: 1174

Answers (1)

user5906610
user5906610

Reputation:

ASP.NET-based web applications very often make requests to WebResources.axd file to retrieve assembly resources and serve them to the Web browser. There is no such file exists on the server because ASP.NET generates the content dynamically when WebResources.axd is requested. So if you have a URL rewrite rule that does rewriting or redirection only if requested URL does not correspond to a file or a folder on a web server’s file system, that rule may accidentally rewrite requests made to WebResources.axd and thus break your application.

This problem can be easily prevented if you add one extra condition to the rewrite rule:

<rewrite>
      <rules>
        <rule name="AngularJS Routes" 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_URI}"  pattern="ITA_CALENDER_API/(.*)" negate="true" />
            <add input="{URL}" negate="true" pattern="\.axd$" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>

Upvotes: 1

Related Questions