Can not navigate directly to Admin page

[plwade]

I can navigate to the 'Admin' page using the side menu link, but this doesn't work if I open a new browser window and enter http://localhost:3000/admin/ in the address bar.

A blank page is displayed containing the error message 'Cannot GET /admin/'

Any idea how to get this working?

Here's my admin.route.js file:-

(function() { 'use strict';

angular
    .module('app.admin')
    .run(appRun);

appRun.$inject = ['routerHelper'];
/* @ngInject */
function appRun(routerHelper) {
    routerHelper.configureStates(getStates());
}

function getStates() {
    return [
        {
            state: 'admin',
            config: {
                url: '/admin/',
                templateUrl: 'app/admin/admin.html',
                controller: 'AdminController',
                controllerAs: 'vm',
                title: 'Admin',
                settings: {
                    nav: 2,
                    content: '<i class="fa fa-lock"></i> Admin'
                }
            }
        }                       
    ];
}

})();

Any help appreciated.

Regards, Paul

[ghost]

Same issue for me when creating a new route. Seems to be an issue with the server implementation and how the ui router is wrapped. Navigating in the client by clicking to navigate to a route works fine but if you refresh the bowser page on a route or navigate to that route directly from an external link/manually typing in the URI then the routing system fails.

[ghost]

Looked into this a bit more and it seems like the express server has a routing issue somewhere...

if I amend the express server setup app.js file as follows:

        app.use('/admin', express.static('./src/client/index.html'));
        app.use('/admin/', express.static('./src/client/index.html'));

the second route doesn't seem to register and I get a "cannot GET /admin/" 404 error in browser.

After I looked at the express docs I found that strict routing could be enabled for trailing slash support.

app.set('strict routing', true);

This makes no difference to the above issue though.

Could this be solved by using a different version of express?

[josencv]

I think there are two conditions for this to work:

1. In angular the $locationProvider should have the html5mode set to true:

   src/client/app/blocks/router/router-helper-provider.js - line 18

   $locationProvider.html5Mode(true);

2. Express server (or whatever you are using) should redirect to 'index.html' on any request that is not a backend endpoint. Maybe:

var path = require('path');

router
    .get('/*', function(req, res) {
      res.sendFile(path.resolve('my-index-path/index.html'));
    });

Or something like that. Put that last in the list of express routes, as the order does matter when resolving routes.

Hope that helps.

PD: I don't like mixing the backend server and the frontend app very much though.

[johnpapa]

html 5 mode is important and having a server that handles a deep link is critical.