Reputation: 6147
I have a simple app running on IIS 8.0 (arvixe hosting) that uses AngularJS for the SPA framework. I turned on html5mode and linked the tag to index.html (the root file), I've also set this file as the in the web.config. I know you have to do server-side rewrites which I have.
What I want to achieve is the following:
User enters 'domain.com' and the site load up domain.com/home. Of course under the URL is actually domain.com/index.html/home but html5mode handles that with the rewrites.
Here is the app.config and this is fine.
.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider ) {
$routeProvider
.when('/home', {
templateUrl: 'templates/home.html',
controller: 'HomeController'
})
.when('/login', {
templateUrl: 'templates/login.html',
controller: 'LoginController'
})
.when('/forum', {
templateUrl: 'templates/forum.html',
controller: 'ForumController'
})
.when('/rebellinks', {
templateUrl: 'templates/rebellinks.html',
controller: 'RebelLinksController'
})
.when('/events', {
templateUrl: 'templates/events.html',
controller: 'EventsController'
})
.when('/oldnews', {
templateUrl: 'templates/oldnews.html',
controller: 'OldNewsController'
})
.otherwise({
redirectTo: '/home'
});
//use HTML5 History API
$locationProvider.html5Mode(true);
}]);
Web.Config file for IIS:
<system.webServer>
<rewrite>
<rules>
<clear />
<!--<rule name="jsRule" stopProcessing="true">
<match url=".js" />
<conditions logicalGrouping="MatchAll" trackAllCaptures="false">
<add input="{REQUEST_FILENAME}" matchType="IsFile" />
</conditions>
<action type="None" />
</rule>-->
<rule name="SRBShome" enabled="true" stopProcessing="true">
<match url="^(.*)$" />
<action type="Rewrite" url="/index.html" />
</rule>
<rule name="AngularJS" enabled="false" 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="/index.html" />
</rule>
</rules>
</rewrite>
<defaultDocument enabled="true">
<files>
<clear />
<add value="index.html" />
<add value="home.html" />
</files>
</defaultDocument>
What this does is loads domain.com/home when the user visits the site but the .js files are transferred as I added a special rule in the rewrite to prevent them from rewriting but I think my pattern on the SRBShome rule needs to be adjusted to work correctly.
Any help appreciated.
Upvotes: 4
Views: 5765
Reputation: 6147
Resolved it with changing the rewrite rules below. This allows index.html to be loaded on IIS. For some reason in web.config doesn't work for this setting. So now when a user requests domain.com the rewrite passes '/index.html' then AngularJS' html5Mode kicks in and cleans up the URLs and removes the hashbang.
<rewrite>
<rules>
<clear />
<rule name="SRBShome" enabled="true" stopProcessing="true">
<match url="^(.+)$" negate="true" />
<conditions>
<add input="{REQUEST_URL}" pattern="^(.+)$" negate="true" />
</conditions>
<action type="Rewrite" url="/index.html" logRewrittenUrl="true"/>
<!--<match url="^.com" />
<action type="Rewrite" url="/index.html" />-->
</rule>
<rule name="AngularJS" enabled="true" 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="/index.html" />
</rule>
</rules>
</rewrite>
Upvotes: 16