Auth0 Home Blog Docs

Client AUth with Securing REST API


#1

I wonder if someone can help me out.
I created SinglePage app that I am using from Angular all works as expected. Now I have created new API on the serverside (java, spring) and I would like to secure it when client makes the calls.

I have created new API and I connected this api application, but still it does not work.

What I tried to test i used the Token retrieved to angular client into the curl command. to test /private api based on this example:

I have configured indentifer with the correct one.

When I try to obtain token manually using curl command described in the LINK, auth works.
But not if I tried to use token retrieved to client that, copying this token and using it on the CURL.

Is there need some additional settings? I just need server to verify only.
I dont really want to generate token on the server side, I want client to create this.

Thank you so much.

Frank


#2

:wave: @frantisek.kolar1 if I understood correctly, you have an Angular application that you want to be able call your API that is on your server (written in Java/Spring)? I would suggest using the Implicit Grant to communicate between your SPA (single page application) and your API. We could setup the API in Auth0 Dashboard. After, we can get consent from the user to invoke the API. Then we will need to extract the access token that is returned. Once we have the access token, we can call our API.

Would this be suitable for what you are trying to achieve?

Further resources on the Implicit Grant, SPAs, and APIs:



#3

Thanks all alot for your feed. I need to got thru all these materials. As I am not sure where to start…


#4

@frantisek.kolar1 sure thing! Ill try to provide a bit more helpful steps, as I feel my post before might be too vague and an overload of information. Let me know what steps you have done, what you have tried so far, and where/when you get stuck!

You said you have an angular application, have you setup the application to authenticate with Auth0? We have some quickstarts for Angular (AngularJS , Angular 2) that discuss authentication and logging a user in.

In the application, when it makes calls to your API, you’ll need to provide a token to authorize the application to do so. So, what we can do is have our angular application authenticate via the Implicit Grant flow (described in links) upon which we will receive an access_token and id_token. We will need to send that access_token to our API. I believe the quickstart sets the audience to the /userinfo endpoint, we would set it to our api (value being audience: 'YOUR_API_IDENTIFIER',). Once we send the access_token in the authorization header to our API, we have our API will validate it and allow the application to make requests.

Does this sound like what you are trying to retrieve? Apologies for all the questions and information overload!


#5

No no. Your asnwer was excellent. it is just that I need to go thru the links you sent me and I can more specific question. :wink:


#6

@kim.noel I also have a similar problem. Should I explain it here or do I need to create a new topic?


#7

if you think it will be helpful/relevant for it to be here in this post, for others in the future, feel free to share it here! if absolutely necessary we can move it over to a different discussion I’d say.


#8

OK, let me share it here, then you tell me what to do :slightly_smiling_face:
I’m trying to get a working example of SPA + API.
So here’s what I did so far (totally overwhelmed by the info):

  1. I created an SPA using download project in the jquery quickstart (while logged in)
  var webAuth = new auth0.WebAuth({
    domain: AUTH0_DOMAIN,
    clientID: AUTH0_CLIENT_ID,
    redirectUri: AUTH0_CALLBACK_URL,
    responseType: 'token id_token',
    scope: 'openid'
  });
  1. Then there’s a backend using downloaded project in spring security backend quickstart (while logged in):
auth0:
  issuer: https://rad-wildrydes-d2ecf5.eu.auth0.com/
  audience: https://rad-wildrydes-d2ecf5.eu.auth0.com/test1
  1. Now on the client side (SPA) after authentication, I receive access_token, id_token, and some other information.
  2. With the given id_token I try to call the API (using curl), but it fails complaining about the claim aud (which in id_token is some random-generated string) but on the backend side it’s the audience.

You already mentioned that the client (SPA) should send access_token to the server side to call secured API endpoint. But access_token is not a valid JWT. Definitely I’m missing something here. would you please tell me what it is?


#9

OK, now I found this:

If the Access Token you got from Auth0 is not a JWT but an opaque string (like kPoPMRYrCEoYO6s5 ), this means that your implementation follows our legacy pipeline. For info on how to use the latest and more secure pipeline, see our OIDC Conformant Authentication Adoption Guide.
Is this what I’m missing?


#10

OK now it’s working :man_dancing:
Quick question: since I’m not interested in id_token any more and also I read somewhere that it’s better to work only with access_token is the following ok to do?

    var webAuth = new auth0.WebAuth({
        domain: AUTH0_DOMAIN,
        clientID: AUTH0_CLIENT_ID,
        redirectUri: AUTH0_CALLBACK_URL,
        responseType: 'token',
        scope: 'profile email',
        audience: AUTH0_AUDIENCE,
        leeway: 60
    });

#11

Glad to see you got it working! If you do not need toe id token you should be good to go! It was added to the OIDC specs as an optimization so the application can know the identity of the user, without having to make an additional network requests.