Currently, I am utilizing the
$locationProvider.html5Mode(true)
function to hide the # tag in the address bar.
angular.module('witnessApp',['ngRoute','witnessApp.Service','witnessApp.Controller','ui.bootstrap','ngAnimate','ngTouch','growlNotifications', 'ngSanitize'])
.config(function ($routeProvider,$provide,$locationProvider) {
var loginReq;
$routeProvider
.when('/login', {
templateUrl: 'views/login.html',
controller:'LoginCtrl',
access: { "requiredLogin": false }
})
.otherwise({
redirectTo: '/login'
})
$locationProvider.html5Mode(true);
})
Upon starting the app, it automatically redirects to the login page at localhost:3000/login (removing the # sign), however, typing or manually entering localhost:3000/login does not result in redirection to the login page. This is due to an API call being made using this method. How can I completely eliminate the # tag from the Angular route? Are there any alternatives to resolve this issue?
Update:-
I am using the Express framework on the backend. Here is the code for server.js:
var express = require('express'),
app = module.exports = express();
app.engine('.html', require('ejs').__express);
app.set('views', __dirname + "/views");
app.set('view engine', 'html');
app.use(express.static(__dirname + "/public"));
app.get('/', function(req, res) {
res.render('index');
});
app.listen(process.env.PORT || 3000);
console.log('[Application] on port 3000');
Some individuals have suggested handling this route on the backend, as seen in the comments below. However, I am unsure of how to do so. Can you suggest a solution for implementing this on the backend?