Signup with username & social connections

@nicolas_sabena Thanks

One other thing. I´m not trying to create a Database user with password. I´m just trying to extend the social connection with username. How can I use CreateUser with social connection? Then I think I´ll have to create the temp token in the rule like the following so I get all the other claims?

  var token = jwt.sign( user, configuration.sharedToken, {
      expiresInMinutes: 15,
     audience: 'http://localhost:3000/signup',
       issuer: 'auth0/rule'
   });

I did notice that the user gets created before the redirect. But I will have to then update that user to have a username.

Now i’m trying the update user in management api but I´m confused what token the ManagementApiClient wants. In your example where do you get the parameter yourApiToken??

Yes, the sample code was for option 1.
Option two, as described by Abhishek:

  • Step 1 will remain the same, However, the page will simply ask for a username.

  • Step 2 will simply add the username to app_metadata.username, in this case, you’ll need to fetch if any users have the same username in order to maintain the uniqueness with Management API v2 Search User and then add app_metadata via the update user command.

That means that, instead of creating a user, you will be adding the “username” as a field in the app_metatada for the user. It’s just additional information that you will use for any purpose within the application. But, for login purposes, the user will be using his or her social identity (that username you are asking will not be involved in the login process when using a social connection).

For social connections you can’t “create” an user, but you can add additional information using app_metadata.

In .Net, that means using the UpdateAsync method for the ManagementApi.Users client, as shown in this test: auth0.net/UsersTests.cs at 8fc2dc51596e5418979a1e63a5115fcacbf9f0bf · auth0/auth0.net · GitHub

@nicolas_sabena Thanks again. But in you example where do you get yourApiToken? This is not the Client Secret?

In his example yourApiToken is a token for the Management API you can generate one using Auth0 Management API v2 or using client credentials flow.

@Abhishek_Hingnikar thanks but the first link is broken

My apologies, I have updated the link.

@Abhishek_Hingnikar @nicolas_sabena
Ok. Almost there… Now the user has clicked save that updated the username.

  1. How do I make the user get a new valid jwt token that contains the username?

  2. Make sure that no one else has that username? (Consistency)

(Keep in mind i´m using angular2 with ASP.net Core backend).

How do I make the user get a new valid jwt token that contains the username?

Remember that this was a redirect rule. So after you set the username in the app_metadata, the authentication flow will run again, and the generated JWT will contain any information you put in the app_metadata, as long as you include it in the scope. I.e. `scope: ‘openid username’.

Make sure that no one else has that username? (Consistency)

Why do you want a username for the user? Do you use it for something in your application? If so, I guess you have a database or something like that with your existing usernames. Check there before assigning the username to the user, in the action, and return some error if the username already exists.

I don´t understand.

FLOW:

  1. User signs up with facebook.
  2. User gets redirected by redirect rule to sign-up page (my domain/website)
  3. User fills out username and clicks save
  4. My server validates token and updates app_metadata with username
  5. Server responds with ok and a new token??? Or does client redirect somewhere???

When using the redirect flow this is what will happen

FLOW:

  1. User signs up with facebook.
  2. User gets redirected by redirect rule to sign-up page (my domain/website)
  3. User fills out username and clicks save
  4. My server validates token and updates app_metadata with username
  5. Your server redirects back to /continue endpoint on Auth0 which resumes the authentication pipeline.
  6. Auth0 redirects to your application with the token which now has username added as a claim.

Get an CORS redirect error :frowning:

XMLHttpRequest cannot load http://localhost:16564/api/v1/users/register?token=xxxx. Redirect from ‘http://localhost:16564/api/v1/users/register?token=xxxx’ to ‘https://moodist.eu.auth0.com/continue’ has been blocked by
CORS policy: Request requires preflight, which is disallowed to follow cross-origin redirect.

Keep in mind this is an Angular 2 SPA application that does not like server routing very much. What is the best approach here. Can I redirect from the angular app? Maby with ?token=… query parameter?

I’m curious how are you POSTing the form? Is this as an XHR? Its being blocked CORS, You can redirect to the continue endpoint from your SPA aswell, in that scenario your POST request should return the response with which you later redirect.

Yes this is XHR. I use the standard way of doing forms with Angular 2

<form (ngSubmit)="onSubmit()" #registerForm="ngForm">
  <div class=" form-group">
    <input type="text" class="form-control" placeholder="Username" (ngModel)]="user.username" name="username">
  </div>
  <button type="submit" ng-cl class="btn btn-primary btn-register">Register</button>
</form>

Component:

onSubmit() {
 this.authService.register(this.token, this.user).subscribe(result => {
        console.log(result);
        //Redirect here????
    },
        error => {
            console.log(error);             
        });
}

Service:

public register(token, user) {
let endpoint = `${this.apiEndpoint}users/register?token=${token}`;
let result = this.http.post(endpoint, user)
  .map(res => res.json());
return result;

};

What should the POST return in that scenario?

If this is an XHR then you can simply return JSON from your server, and use it to show errors etc if the request succeeds then you should redirect to https://{YOUR_DOMAIN}.auth0.com/continue?state={STATE} where the state is the same as the state in your querystring.

What do you mean exactly? Is this for redirect url when it redirects back to my app?

Got this errror when redirecting to https://mydomain.eu.auth0.com/continue?state=movies

invalid_request: Error resuming the authentication transaction after redirect. If you are using any social network as a connection, make sure you register your own account (vs. using Auth0’s Dev Keys). Please check Redirect Users from Within Rules for more information.

When you use redirect rules, you should have a state parameter added to the page where the user enters the username and finishes the procedure. The state=movies looks suspicious to me, this state is not the one that you send to Auth0, this is a special state used by Auth0 to know if the redirect is returning from an Authorized Client. If this state is missing, you can simply return nothing (this is part of the experimental pipeline but will be enforced).