{"id":16896,"library":"sanji-auth-ui","title":"Sanji Auth UI","description":"Sanji Auth UI is a core component of the Sanji UI framework, specifically designed for seamless integration within AngularJS 1.x applications. It provides robust authentication and authorization services, leveraging JSON Web Tokens (JWT) for secure user identification and session management. The package includes an `auth` service for handling login requests and a `session` service for storing and retrieving authenticated user data. Its current stable version is `1.4.0`, released in September 2018, indicating an infrequent and likely discontinued release cadence. A key differentiator is its tight coupling with the AngularJS 1.x ecosystem (specifically versions 1.5.0 to 1.6.x), making it unsuitable for modern Angular or other contemporary frontend frameworks. It also relies on specific versions of `angular-http-auth`, `angular-storage`, and `sanji-rest-ui` as peer dependencies.","status":"abandoned","version":"1.4.0","language":"javascript","source_language":"en","source_url":"https://github.com/Sanji-IO/sanji-auth-ui","tags":["javascript","sanji"],"install":[{"cmd":"npm install sanji-auth-ui","lang":"bash","label":"npm"},{"cmd":"yarn add sanji-auth-ui","lang":"bash","label":"yarn"},{"cmd":"pnpm add sanji-auth-ui","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core AngularJS framework dependency for the UI module.","package":"angular","optional":false},{"reason":"Handles HTTP authentication interception and retries for AngularJS applications.","package":"angular-http-auth","optional":false},{"reason":"Provides client-side storage mechanisms for session data and tokens.","package":"angular-storage","optional":false},{"reason":"Another module within the Sanji UI framework, likely for REST API interactions.","package":"sanji-rest-ui","optional":false}],"imports":[{"note":"This is an AngularJS 1.x module name, included via dependency injection in your Angular app's module definition. It is not an ES module export.","wrong":"import { sanjiAuth } from 'sanji-auth-ui'","symbol":"'sanji.auth'","correct":"angular.module('myApp', ['sanji.auth'])"},{"note":"The `auth` service is an AngularJS injectable service. It should be injected into controllers, services, or directives using Angular's dependency injection system, not imported as a standard JavaScript module.","wrong":"import { auth } from 'sanji-auth-ui'","symbol":"auth","correct":"class MyController { constructor($http, auth, session) { /* ... */ } }"},{"note":"The `session` service is also an AngularJS injectable service, similar to the `auth` service. It is made available via Angular's dependency injection after the `sanji.auth` module is loaded.","wrong":"import { session } from 'sanji-auth-ui'","symbol":"session","correct":"class MyController { constructor($http, auth, session) { /* ... */ } }"}],"quickstart":{"code":"angular.module('webapp', ['sanji.auth'])\n  .controller('AppController', ['$http', 'auth', 'session', function($http, auth, session) {\n    this.credentials = { username: '', password: '' };\n    this.login = (credentials) => {\n      // Authenticate a user\n      auth.login('/auth/local', credentials)\n      .then((data) => {\n        // Return token data\n        return $http.get('/users/me');\n      })\n      .then((res) => {\n        // Return authenticated user data and save in session service\n        session.setUserData(res.data);\n        console.log('User logged in:', session.getUserData());\n      })\n      .catch((error) => {\n        console.error('Login failed:', error);\n      });\n    };\n  }]);\n\n// Example of configuring authProvider\nangular.module('webapp').config(['authProvider', function(authProvider) {\n  authProvider.configure({\n    roles: {\n      admin: 'admin',\n      guest: 'guest'\n    }\n  });\n}]);\n\n// Example of configuring sessionProvider\nangular.module('webapp').config(['sessionProvider', function(sessionProvider) {\n  sessionProvider.configure({\n    tokenHeader: 'Authorization',\n    tokenKey: 'jwt_token'\n  });\n}]);","lang":"javascript","description":"This quickstart demonstrates how to include the `sanji.auth` AngularJS module, inject the `auth` and `session` services into a controller, perform a user login with credential handling, and configure the `authProvider` and `sessionProvider`."},"warnings":[{"fix":"For modern applications, use a dedicated authentication solution designed for your current frontend framework (e.g., Auth0, Firebase Auth, or a custom JWT implementation for Angular/React/Vue).","message":"This package is specifically built for AngularJS 1.x (versions 1.5.0 to 1.6.x) and is incompatible with newer versions of Angular (Angular 2+) or other frontend frameworks. Attempting to use it outside its intended environment will lead to runtime errors.","severity":"breaking","affected_versions":"all"},{"fix":"Strongly consider migrating to an actively maintained authentication library to ensure ongoing security, compatibility, and support.","message":"The project appears to be abandoned, with its last release (v1.4.0) in September 2018. This means no further bug fixes, security updates, or feature enhancements are expected, making it a potential security risk for production applications.","severity":"gotcha","affected_versions":">=1.4.0"},{"fix":"Ensure all peer dependencies are installed and match the specified version ranges. If using newer npm/yarn versions, you might need to use `--legacy-peer-deps` for installation, but proceed with caution as this can mask underlying compatibility issues.","message":"The package relies heavily on several specific peer dependencies (angular, angular-http-auth, angular-storage, sanji-rest-ui). Mismatched versions of these dependencies can lead to runtime errors or unexpected behavior due to API changes or incompatibilities.","severity":"gotcha","affected_versions":"all"}],"env_vars":null,"last_verified":"2026-04-22T00:00:00.000Z","next_check":"2026-07-21T00:00:00.000Z","problems":[{"fix":"Ensure `'sanji.auth'` is explicitly listed in your `angular.module()` dependencies: `angular.module('yourApp', ['sanji.auth'])`.","cause":"The 'sanji.auth' module was not correctly registered or included as a dependency in your main AngularJS application module.","error":"Module 'webapp' is not available! You either misspelled the module name or forgot to load it. If this error occurs while loading a route, ensure that you have configured the route correctly."},{"fix":"Verify that the `sanji-auth-ui` script is loaded *before* your AngularJS application code in your HTML, and that `sanji.auth` is correctly added as a dependency to your AngularJS application module.","cause":"The `auth` service was requested via dependency injection, but the `sanji.auth` module was either not loaded or its services were not correctly initialized.","error":"Error: [$injector:unpr] Unknown provider: authProvider <- auth"},{"fix":"Ensure `angular.js` (or `angular.min.js`) is loaded as the very first script in your HTML `<head>` or `<body>` before `sanji-auth-ui` or any other AngularJS-related scripts.","cause":"The AngularJS library (`angular.js`) itself is not loaded or is loaded incorrectly, before any dependent modules or application code.","error":"Uncaught TypeError: angular.module is not a function"}],"ecosystem":"npm","meta_description":null}