Javascript redirects to the wrong URL [duplicate]

Question

I'm using angularjs and I have a very basic app...

let app = angular.module('GHoF', [ 'ngRoute' ]); app.config(function Config($routeProvider) { // Routes console.log($routeProvider); $routeProvider .when('/applications', { templateUrl: 'app/pages/myApplications/myApplications.html', controller: 'MyApplicationsCtrl' }) .otherwise({ redirectTo: 'app/pages/auth.html' }) });

HTML

<html lang="en" ng-app="GHoF"> <head> <script src="node_modules/angular/angular.js"></script> <script src="node_modules/angular-route/angular-route.js"></script> <script src="app/app.js"></script> <title>Home</title> </head> <body> <main ng-view></main> </body>

The problem is that it's redirecting me to the wrong URL.

http://127.0.0.1:8080/#!/app/pages/auth.html

I don't know why but it appears /#! in the URL. This is a very basic app...

What do you mean? I didn't configure anything else beside what I have — user12361681
– user12361681, Commented Mar 10, 2020 at 16:46

Shaun E. Tobias · Accepted Answer · 2020-03-10 17:08:55Z

You need to enable HTML5Mode to get rid of the hashbangs. First you need to add the base href in your index file (I usually put this directly under the opening <head> tag):

<base href="/">

Then in your config, you should enable it via the $locationProvider:

app.config(function Config($routeProvider, $locationProvider) { $locationProvider.html5Mode(true); $routeProvider .when('/applications', { templateUrl: '/app/pages/myApplications/myApplications.html', controller: 'MyApplicationsCtrl' }) .otherwise({ redirectTo: '/app/pages/auth.html' }) });

Don't forget you will want to handle server rewrites if you plan on going directly to those routes in HTML5 mode.

This is a good resource for information on how to do that for different servers: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode

I think redirectTo: 'app/pages/auth.html' needs a leading slash to redirect from the root. Try redirectTo: '/app/pages/auth.html' or even redirectTo: '/pages/auth.html' if /app is already your root
it doesn't redirect... I go to http://127.0.0.1:8080/applications and says Cannot GET /applications
If you're going directly to that URL, you need to add rewrites to your server. See: riptutorial.com/angularjs/example/21798/…
@user12361681I updated my answer with a better link in case you're not using apache

Collectives™ on Stack Overflow

Javascript redirects to the wrong URL [duplicate]

1 Answer 1

5 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Linked

Related