AngularJS html5Mode routing problems hosted in IIS 8.5

I either get a 403.14 - Forbidden error or a 404 - Not Found error when I try to navigate through the routes of my AngularJS application.

When I try to navigate to the base URL, I get a 403.

Example: http://localhost/Board.WebApp/ gives a 403.

For all other routes, I get a 403.

Example: http://localhost/Board.WebApp/template1 gives a 404.

What seems to be the problem? Here is my code:

default.html:

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" xmlns="http://www.w3.org/1999/xhtml" id="app">
<head>
    <title>Board</title>
    <link rel="stylesheet" href="css/app.css" />
    <base href="/Board.WebApp/" />
</head>
<body ng-cloak>
    <section id="local-content" ng-view></section>
</body>
</html>

routes.js

function (module, amd) {
    'use strict';
    var mod = angular.module('routes', ['ngRoute']);
    mod.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {

        $locationProvider.html5Mode({
            enabled: true,
            requireBase: true
        }); // for pushState routing support instead of # hash

        $routeProvider
            .when("/", amd.route(
            {
                templateUrl: 'views/home.html',
                controller: 'eventController',
                controllerUrl: 'app/controllers/eventController'
            }))
            .when("/template1", amd.route(
            {
                templateUrl: 'views/templates/template1.html',
                controller: 'eventController',
                controllerUrl: 'app/controllers/eventController'
            }))
    }]);
});

Upvotes: 1

Views: 612

Answers (1)

There is some server-side configuration required if you want to run in HTML5 mode: the server must rewrite links to the application entry point.

Upvotes: 1

Related Questions