Difficulties with angular ui-router authentication problems

When setting notify to true, the login.html does not render - it shows up as a blank page. However, if set to false, I receive multiple errors in the console:

RangeError: Maximum call stack size exceeded
    at $.resolve (angular-ui-router.min.js:1)
    at b (angular-ui-router.min.js:1)
    at Object.x.transitionTo (angular-ui-router.min.js:1)
    at Object.x.go (angular-ui-router.min.js:1)
    at app.js:317
    at p.$broadcast (angular.min.js:3)
    at Object.x.transitionTo (angular-ui-router.min.js:1)
    at Object.x.go (angular-ui-router.min.js:1)
    at app.js:317
    at p.$broadcast (angular.min.js:3)

My router code is as follows:

$rootScope.$on('$stateChangeStart', 
   function(event, toState, toParams, fromState, fromParams) {

        var shouldLogin = !$window.sessionStorage.token && !AuthenticationService.isLogged;

        $rootScope.Authenticated = shouldLogin;

        //redirect only if both isAuthenticated is false and no token is set
        // if (!AuthenticationService.isLogged && !$window.sessionStorage.token) {
        //     $state.go('login');
        // }

        //console.log($rootScope.Authenticated);

        if(shouldLogin) {
            $state.go('login', {}, {notify: false, location: false});
            event.preventDefault();
            return;
        }

    });
javascriptangularjsangular-ui-router

Answer №1

One suggestion I have is to continue on your path, but make sure to include a condition that prevents redirection when already heading to the login page:

$rootScope.$on('$stateChangeStart', 
  function(event, toState, toParams, fromState, fromParams) {

    var alreadyGoingToLogin = toState.name === "login";
    if(alreadyGoingToLogin) {
      return
    }
    ...

For reference, you can examine these examples with implemented solutions:

  • Angular ui router - Redirection doesn't work at all
  • Angularjs ui-router. How to redirect to login page

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is there a way to store a complete array within a single cell?

I am searching for a solution to assign an entire array to a cell in Google Apps Script and Google Sheets. My attempt at using cell.setValue(array) only resulted in the cell containing the first item of the array. var cell = SpreadsheetApp.getActiveSprea ...

javascriptarraysgoogle-apps-scriptgoogle-sheets

The input object parameter for the Web API Delete method is found to be lacking,

My WebAPI asp.net mvc controller Delete method is receiving a null object called contact, and despite thorough code checks, I can't identify the root cause. Interestingly, my edit operation works flawlessly in a similar manner. What could be causing ...

asp.net-mvcangularjsasp.net-web-api

Saving Pictures in Database Without Using jQuery

Hey there fellow developers, I'm currently immersed in a web project that involves reconstructing a social media platform similar to snapchat. To capture images, I am utilizing my webcam with JavaScript and saving the image data to a variable named i ...

javascriptphphtmlajax

Error: Unable to locate module '@material-ui/lab/TabContext' in the directory '/home/sanika/Desktop/Coding/React/my-forms/src/Components'

Hello everyone! I recently started working with ReactJs and I'm currently facing an issue while trying to implement TabContext using the material UI library in React. Upon debugging, I suspect that the error might be related to the path configuration. ...

javascriptreactjsmaterial-ui

Outputting data to a WriteStream within an Event Listener

My current issue involves an EventEmitter object set up to listen for events and write information to a file when the event is emitted. Using fs.createWriteStream(path, { flags: 'a'});, I have opened a FileStream. However, emitting events quickly ...

javascriptnode.jsevent-handling

What is the best way to reset the size of an element in webkit back to its original dimensions?

I am having an issue with an element that changes to display absolute and covers its parent element on focus via javascript. However, when it goes back to its default state on blur, it does not return to its original position. This problem seems to only o ...

javascripthtmlcsswebkit

Assign a unique value to every line in a JSON string within the Vue.js hierarchy of components

I created a Vue component that initializes an empty list and an object like this: data: function(){ return { list: [], newThing: { body: '', }, }; }, The list is then populated with JSON data fetched ...

javascriptarraysjsonobjectvue.js

Is it possible to transfer a massive number of files using node.js?

I need to asynchronously copy a large number of files, about 25000 in total. I am currently using the library found at this link: https://github.com/stephenmathieson/node-cp. Below is the code snippet I am using: for(var i = 0; i < 25000; i++ ...

javascriptnode.js

Executing a get request in Backbone without using the Option parameter by implementing the beforeSend method

After gathering insights from the responses to this and this queries, I have formulated the code below for a GET request: var setHeader = function (xhr) { xhr.setRequestHeader("Authorization", "Basic " + btoa($rootScope.login.Gebruikersnaam + ":" + $r ...

javascriptangularjsrestbackbone.jsget

Experiencing difficulties integrating relational data with Angular and MongoDB

I have a view where I display 'Transporters'. Each Transporter has multiple 'Deliveries', so I want to associate Deliveries with the corresponding Transporters. My tech stack includes express, mongoose, and angular.js. Here are my mode ...

javascriptnode.jsmongodbangularjsmongoose

Is there a way to update an angular.js service object without using extend or copy?

I am working with 2 services and need to update a variable in the first service from the second service. Within a controller, I am assigning a scope variable to the getter of the first service. The issue I am facing is that the view connected to the cont ...

javascriptangularjs

Exploring JavaScript and accessing objects

I'm currently working on a small file-manager project in JavaScript and I've encountered an issue with the code. In the `get()` function, I am trying to access the `Content.files` array but it seems like there's some problem with variable sc ...

javascriptjqueryajaxjsonobject

how to pass arguments to module.exports in a Node.js application

I have created a code snippet to implement a Node.js REST API. app.js var connection = require('./database_connector'); connection.initalized(); // I need to pass the connection variable to the model var person_model = require('./mod ...

javascriptnode.jsexpress

Exploring depths with nested ng-Repeat in Depth First Search

I am dealing with an object that has variable key names, each of which contains nested objects. My goal is to perform a depth-first search (DFS) over this object. For example, consider the following object: object = { "var1" : { "var2 ...

htmljsonangularjsobjectdepth-first-search

I am having an issue with an input field not reflecting the data from the Redux state in my React app,

I am currently working on a todo list project using the MERN stack with Redux for state management. One issue I am facing is that the checkboxes for completed tasks are not reflecting the correct state from Redux when the page loads. Even though some tasks ...

javascriptreactjsredux

What is the best method for tracking the execution time of functions in Node.js?

My nodejs application has numerous functions that need to be executed. I am looking for a way to log the time taken to execute each function. For example, when my app runs these functions: execfn1(); -> should output in some log, takes: 1ms.. execfn ...

javascriptnode.jsperformance-testingv8

Single array returned by observable

Issue: I am looking for a way to consolidate the multiple arrays returned individually into a single array. Solution: fetchAllRiders() { var distanceObs = Observable.create(observer => { this.http.get(this.API + '/driver/all').map(res = ...

javascriptangularrxjs

Whenever I clear the contents of the datatable, I notice that 2 thead elements

I am facing an issue with a table that I populate using jQuery's .append() function and then initialize it as a datatable. Since the data is not fetched via an ajax call, I clear both the tbody and thead using .empty(). However, I encounter a problem ...

javascriptjquerydatatables

jQuery and Bootstrap collide

Here is my jQuery code that toggles visibility of different divs based on a click event: $(function () { $(".kyle-div, .tracey-div, .frank-div, .rosie-div").hide(); $("a").bind("click", function () { $(".conor-div, . ...

javascripthtmljquerycssbootstrap-4

After following the official guide, I successfully installed Tailwind CSS. However, I am facing issues with utilizing the `bg-black` className for styling the background,

Following the installation guide for Tailwind CSS, I ran the command npm install -D tailwindcss postcss autoprefixer npx tailwindcss init -p. Despite this, the background className (bg-black) is not working as expected. Here are the file paths: Directory ...

javascripthtmlcsstailwind-css