stormpath/stormpath-sdk-angularjs

User Management for AngularJS (1.x) applications

Stormpath is Joining Okta

We are incredibly excited to announce that Stormpath is joining forces with Okta. Please visit the Migration FAQs for a detailed look at what this means for Stormpath users.

We're available to answer all questions at [email protected].

What does this mean for developers who are using this library?

• If you have upgraded to the 2.x series from 1.x, you should downgrade to 1.1.1. Why? The 2.x series depends on the Stormpath Client API, which will not be migrated to the Okta platform.
• When downgrading to 1.1.1 you will need to use one of our backend framework integrations to serve the APIs that the 1.x series depends on.
• These backend integrations are being patched to work with Okta:

• Java Spring
• Java Spring Boot
• Node Express
• ASP.NET 4.x
• ASP.NET Core

• If you are using the Express integration, please see the Express-Stormpath Angular Sample Project, it can be used to test your migration to Okta.

README

If you are actively using this library, you can find the old readme in OLD-README.md. It is not possible to register for new Stormpath tenants at this time, so you must already have a Stormpath tenant if you wish to use this library during the migration period.

stormpath-sdk-angularjs's Issues

Controllers to Services? $scope to this?

Hey @robertjd ,

I am looking at the SDK and wonder if $scope is really necessary anymore. Why not write this.whatever = function(somethingCool){}; inside a controller, or better yet in a factory and calling it in the controller? Would you consider that? I was thinking about this after refactoring some of my code and thought it would be something worth mentioning for the Stormpath SDK. If it is a completely outrageous idea, my apologies.

Add a way to track angular library usage through the stormpath api

I'm slightly unsure if the node sdk needs to be modified to support this, but this issue can be tracked here

sp-registration-form auto-login not working

I'm using the registration form directive with the default template. The documentation says if the verification workflow is disabled and I set auto-login to true it should log them in after registration. I'm positive the workflow is disabled and it is still displaying the notice about checking their email for the verification link.

Here's my directive:

Here's the message I get after a successful registration:
Your account has been created. Please check your email for a verification link.

The documentation says it should make a call to $auth.authenticate but I don't see any such event happening. Is this broken or am I doing something wrong?

Add X-Stormpath-Agent header

For requests that are made by this library, add the X-Stormpath-Agent header, where the value is stormpath-sdk-angularjs/<version>. Do not add this header if the request is going to a domain that is different from the current document, because we do not want to cause a cross-domain security exception for the application that is using this library.

Update to work with upcoming [email protected]

With these changes I think we should move this library to 1.0 - ping @timothyej

Todo

• Add X-Stormpath-Agent header (#106)
• Implement the login view model (#108)
• Implement the registration view model (#109)
• Implement the new JSON error responses (#110)
• Change logout to use POST request (#116)

How to change email content, or maybe translate it?

I'd like to know how to change the message of the reset passwork mail, or maybe just translate it to another idiom?

Implement the registration view model

Implement the registration view model according to the spec.

if-user should behave like ng-if instead of ng-show

if-user hides content when the user is not logged in using the display property. Since the content is included, the controllers associated with it are initialized and data requests during initialization receive 401 responses because the content is for authenticated users.
e.g. if the nav bar displays a notifications count to logged in users and the count is retrieved in a dedicated controller

To avoid these unnecessary requests, if-user should behave like ng-if and not include the content at all when the user is not logged in

Angular-Fullstack Update

I think that the tutorial needs to be updated to the newest version of Angular-Fullstack. There are options in version 3 that are not in version 2. For example, you now have to choose between Mongo or SQL for a database, when before you could just not select anything. Also, now you have to select the testing suite that you will use, which wasn't there before. So, I think this probably should be updated. Thoughts?

STORMPATH_CONFIG.FORM_CONTENT_TYPE='application/json' is ignored

STORMPATH_CONFIG.FORM_CONTENT_TYPE='application/json'

is ignored - our server is still getting form urlencoded, this was not broken a couple of revisions ago, so it's been introduced recently.

Finish LinkedIn implementation

The service boilerplate is there, but we need to finish it and use express-stormpath to handle the OAuth callback.

Error: [$rootScope:infdig] 10 $digest() iterations reached.

While building your Angular application with this module, you may encounter this error:

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []

This happens when your default view (main if you are following our Angular Guide) is using the waitForUser option. The cause is this upstream bug: angular-ui/ui-router#600

Workaround:

Instead of this:

$urlRouterProvider
  .otherwise('/');

Use this:

$urlRouterProvider.otherwise( function($injector, $location) {
    var $state = $injector.get("$state");
    $state.go("main"); //redirect to a 404 page
});

If you are using our Angular Guide to create a project from scratch, that code will go into client/app.js

Refactor: Separate into own files

Separate each directives and service into their own files if possible. Maybe create some folders too, e.g. directives/ and services/.

stormpath-sdk-angular.js not found

After building per README, stormpath-sdk-angular.js is 404 Not found.

stormpath-sdk-express is installed by npm within node_modules.

Social login

Hey team,

When can we expect implementation for social login?

Jagdeep

Add Support for Social Login

Social Login is supported by the API itself, but not the SDK. The only change I required in this SDK to support Facebook login was to send down a different grant_type to the server (using the stormpath express SDK which then needed to handle the new grant_type).

Allow developers to override the STORMPATH_CONFIG

I created a pull-request for this as a temporary fix: #15

The use-case i had was that the API is on a different URL, so i needed a way to change the base-url for all endpoints.

Angular Directives require JQuery

This isn't a big deal, but you should probably denote that somewhere. Since you are using:

.directive('ifUser',['$user','$rootScope',function($user,$rootScope){
  return {
    link: function(scope,element){
      $rootScope.$watch('user',function(user){
        if(user && user.href){
          element.show();
        }else{
          element.hide();
        }
      });
    }
  };
}])

Specifically the element.show() is a JQuery function. If you don't have JQuery present you'll have a bad time.

Refactor: SPA Config Service

With the introduction of Social Login, we've added the dependency of a /spa-config end-point. This is consumed directly from the $socialLogin service. Instead, we should move this into it's own service that can be used by other parts as well, e.g. a password policy service.

Add Customization for /logout

It would be nice if we could customize the logout URIs.

On logout, defaultPostLoginState view flashes with possible auto re-login

On logout, the view changes independently of the session ending. One way to see this in action is to put a breakpoint in AuthService.prototype.endSession on the call to $rootScope.$broadcast(STORMPATH_CONFIG.SESSION_END_EVENT). Then login, go to a view other than what's set for defaultPostLoginState and then logout.

I assume that the view changes to loginState on logout but since the session is still active, it instead forwards to defaultPostLoginState. Eventually the session ends (move on from the breakpoint) and the login page is displayed. This behavior causes a flash of the defaultPostLoginState on logout.

A side-effect of this flash is that the user can get logged back in during logout. In my case, the main state controller makes server requests and these revive the access/refresh tokens. Probably the requests start before the tokens have been cleared and complete after the logout request. This causes the user to be silently logged back in even though he is taken to the login page. This may be fixed by stormpath/express-stormpath#127

Error message for missing username/password is too technical

If the sp-login-form is submitted without a username/password, the displayed error message is
'Missing username or password in post body'
'in post body' should be dropped.

Implement the new JSON error responses

Implement the new JSON error format according to the spec.

Cannot navigate to profile view

I have an angular app with the run and config defined:

app.config(function($stateProvider, $urlRouterProvider){
    $stateProvider
        .state('main', {
            url: "/",
            templateUrl: "templates/main.html",
            controller: 'MainCtrl'
        })
        .state('register', {
            url: "/register",
            templateUrl: "templates/register.html",
        })
        .state('login', {
            url: "/login",
            templateUrl: "templates/login.html",
        })
        .state('profile', {
            url: '/profile',
            controller: 'ProfileCtrl',
            templateUrl: 'templates/profile.html',
            sp: {
                authenticate: true
            }
        });

    $urlRouterProvider.otherwise("/");
});

app.run(function($stormpath){
  $stormpath.uiRouter({
    loginState: 'login',
    defaultPostLoginState: 'main'
  });
});

The ProfileCtrl is empty:

app.controller('ProfileCtrl', function($scope){

});

Then I navigate to the profile view after login using

<li if-user ng-class="{active: isActive('/profile')}">
      <a ng-href="/profile">Profile</a>
  </li>

This redirects me to http://localhost:3000/profile#/ but the profile template does not show up (instead my 'main' template stays showed). I am using node.js for the server side. Why is the profile view not rendering? I can provide the server code if necessary. All I really have there is the app.use(stormpath.init({}).

Version 0.8.2 results in XHR errors

Using the latest version via bower, login results in XHR errors. But when using the files from the example app, everything works nicely.

Need to investigate this further as I haven't verified this behaviour myself yet.

Login post needs to be Oauth compliant

Right now it's posting a JSON object, but it should be posting a for application/x-www-form-urlencoded - this is required to be compatible with our Java SDK

sp-logout Not Working

Hello @robertjd
Sign Out,
I am using sp-logout for logout. Let say i am on user dashboard page then i click logout. But it remain on same page but all auth navbar hide and login register option display.

Please help me.

Thanks in advance :)

Implement the login view model

Implement the login view model according to the spec.

Implement Social Login

We will use the default endpoint of /login to accept data for social login. It will accept a providerData field, which is an object that contains a providerId field and a accessToken or accessCode field.

We will also need to provide an endpoint which exposes the clientId for the provider's JavaSscript library.

This requires cooperation with our framework integrations. That work is currently being defined (for express) in this issue:

stormpath/express-stormpath#112

At the moment this library has a social workaround, which overloads the /oauth/token endpoint that is supported by the Stormpath Express SDK. We will be removing that workaround as part of this task.

NPM?

Would love to be have the angular sdk on NPM (to install via Browserify or other browser npm package manager). Thoughts?

Wrong module name in module.exports

Yeah, so you have

module.exports = 'ui.router';

in dist/stormpath-sdk-angularjs.js. Surely that should be

module.exports = 'stormpath';

new router implementation?

Are there any plans branches to support new router https://angular.github.io/router/?

Console error running dashboard-app example

Hello,

I followed the instructions to run the dashboard-app example, but unfortunately, I get the following error in the console when viewing the Register page:

TypeError: undefined is not a function
    at Object.definition.$get (<anonymous>:324:30)
    at Object.invoke (angular.js:4203)
    at angular.js:4021
    at getService (angular.js:4162)
    at Object.invoke (angular.js:4194)
    at extend.instance (angular.js:8493)
    at angular.js:7739
    at forEach (angular.js:331)
    at nodeLinkFn (angular.js:7738)
    at angular.js:7998angular.js:11655 (anonymous function)

The page loads, but it is clearly broken and will not register a user.

Any ideas or help to get this app running would be appreciated!

Regards, Rob

Logout request should be POST instead of GET

In order to comply with the framework spec, we need to change the logout request from making a GET to a POST request.

This endpoint should respond to POST requests only. Responding to GET requests is problematic because the browser's Omnibar can make arbitrary GET requests to this endpoint, and Robert can troll you with superlogout-dot-com.

Part of #105.

sp-login-form template using incorrect 'for' attrbute for username label

The label for the username field specifies for=spEmail but the input field's id is spUsername

Tests broken following guide

Following the guide here:
http://docs.stormpath.com/angularjs/guide/configure_angular.html

After performing the step: Add Stormpath to the Angular Application,
the client tests (grunt test:client) fail with the error:

PhantomJS 1.9.8 (Mac OS X 0.0.0) Controller: MainCtrl should attach a list of things to the scope FAILED
Error: [$injector:modulerr] Failed to instantiate module dashboardApp due to:
Error: [$injector:modulerr] Failed to instantiate module stormpath.templates due to:
Error: [$injector:nomod] Module 'stormpath.templates' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.4.0/$injector/nomod?p0=stormpath.templates

I tried explicitly adding
'client/bower_components/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.js',
'client/bower_components/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.tpls.js',
to files in karma.conf.js but then I get the error:
PhantomJS 1.9.8 (Mac OS X 0.0.0) Controller: MainCtrl should attach a list of things to the scope FAILED
TypeError: 'undefined' is not a function (evaluating 'encoder.encode.bind(encoder)')
at FormEncoderService (/Users/aaron/Development/test-1/client/bower_components/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.js:1095)
at formEncoderServiceFactory (/Users/aaron/Development/test-1/client/bower_components/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.js:1196)

Refactor: CSS for built-in templates

Figure out a better way to structure the CSS for the built-in templates. Right now CSS have to be defined with <style> tags together with the forms and cannot be shared among other forms.

Also, the forms are styled using bootstrap, which isn't documented. I would recommend adding all of our own independent styling instead.

Make an option to use auth-header instead of cookies

I have the API on a different URL than the angular application. Cookies don't work very well with different host names between the FE and the API. Would be nice if i had the option of sending the token in an auth-header instead of a cookie.

Using ifUserInGroup directive with no group: this.groups.filter is not a function

When logged in with a user not in any group.

Using ifUserInGroup like this:

<li if-user-in-group="'admins'">...</li>

I get this in the console:

TypeError: this.groups.filter is not a function
    at User.inGroup (stormpath-sdk-angularjs.js:2002)
    at User.groupTest (stormpath-sdk-angularjs.js:2022)
    at evalElement (stormpath-sdk-angularjs.js:611)
...

My bower.json:

{
  "name": "app",
  "dependencies": {
    "angular": "~1.4.5",
    "angular-ui-router": "ui-router#~0.2.15",
    "bootstrap": "~3.3.5",
    "font-awesome": "~4.4.0",
    "stormpath-sdk-angularjs": "~0.7.0"
  }
}

Implement localStorage strategy if detected that domain is different

Not all clients have a cookie store, for example the Iconic framework. At the moment this library assumes that authentication is being handled by cookies.

This library should support the ability to pass the access token in the Authorization header, but the details about where the token is stored should be abstracted behind a generic interface. If using mobile, the filesystem api should be used (or some other secure storage api where the data is scoped to the application) for storing the access token and refresh token. For example, I Ionic promotes the use of the SecureStorage plugin for Apache Cordova

We would also need to implement some client-side code that can exchange a refresh token for a new access token, if the access token expires.

Essentially, we need a client-side Oauth2 implementation that depends on a generic interface for reading and writing tokens in a secure fashion.

If it's detected that a login request is going to be posted to a different domain (via ENDPOINT_PREFIX configuration), we should instead use the /oauth/token endpoint, instead of the /login endpoint, and manage the storage of the tokens as described above.

Running unit tests in authenticated endpoints

Is there any way to run supertests test in authenticated endpoints like this one?

'use strict';

var should = require('should');
var app = require('../../app');
var request = require('supertest');

describe('GET /api/things', function() {

  it('should respond with JSON array', function(done) {
    request(app)
      .get('/api/things')
      .expect(200)
      .expect('Content-Type', /json/)
      .end(function(err, res) {
        if (err) return done(err);
        res.body.should.be.instanceof(Array);
        done();
      });
  });
});

Example project: redirect user from 'register' to post-login-state if authenticated

In the example project, if an authenticated user goes to /register, the registration view is shown. The user should be redirected to to the post-login-state in that case.

Google Login is hard-coded for Offline Access

This might be a problem. Today, when using our express-angular sample application, the Google log-in dialog was blatantly asking me for "Offline Access", and not outlining the scopes it wanted.

However, as with most google login issues, I only saw it two or three times (revoking the app access in-between each attempt). I can no longer reproduce.

Has anyone else seen this issue?

This makes me concerned that GoogleUser.grantOfflineAccess() is the wrong API to be using, because we definitely do not want offline access as our default scope request. By default we should only ask for email.

npm install doesn't install devDependencies

the readme should state "npm install --dev", or the packages.json should include the packages in "dependencies".

Also, "npm install --dev" didn't install the dependencies correctly, I had to install them one by one.

Support ngRoute

At the moment we only support UI Router for a routing mechanism, we want to support ngRoute as well

Cookie not being sent, when using a different backend port

Maybe this is my node/angular/js noobie showing, but I have altered the STORMPATH_CONFIG, since i run two separate apps ('frontend' (angularjs) and 'backend' (node json api))

(Warning: CoffeeScript)

angular.module('app.controllers', [
'stormpath'
])
.config( (STORMPATH_CONFIG) ->
STORMPATH_CONFIG.AUTHENTICATION_ENDPOINT = 'http://localhost:9000/oauth/token'
STORMPATH_CONFIG.CURRENT_USER_URI = 'http://localhost:9000/api/users/current'
)
...

When I do this, the two set-cookie's from /oauth/token are not sent back to /api/users/current. Not certain if there is something else I need to adjust on my node backend script or not. Hoping someone might know what is going on. I will post code, as requested.

withCredentials is always true

We have this blanket interceptor that always sets the withCredentials option to true:

https://github.com/stormpath/stormpath-sdk-angularjs/blob/master/src/module.js#L198

This creates a problem if the Angular application needs to talk to another API on another domain, and that API does not require credentials (and as such, does not add the Access-Control-Allow-Credentials header to OPTIONS responses).

The intention of this interceptor is to ensure that we send our authentication cookies to the backend server that is running our SDK on the sever. But we need a better solution that doesn't set this option all the time, only when needed.

sp-logout should make request with accept json header

The request that sp-logout makes should be sent with an accept: json header. When sent as accept: text/html an unnecessary redirect is made to /.

TypeError: Cannot read property 'filter' of undefined.

Hello,
I am using this module on front end and "express-stormpath": "^2.0.14", in backend. I want to apply group filter on state.

sp: {
authorize: {
group: 'admins'
}
}
but it's give me an angular error. "TypeError: Cannot read property 'filter' of undefined.".
Please help me.
Thanks in advance :)

block login page when logged in

Hi,

Is there a way to prevent users to go the the login page or signup page when already logged in?