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.
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With