Anooj VB
Excellent tutorial! How can we get group details of the user in Angular and use that to show/hide links/pages?
Anooj VB
Excellent tutorial! How can we get group details of the user in Angular and use that to show/hide links/pages?
Amitabh
Thank you Matt
Matt Raible
Hello Anooj,
You can do this by adding a ”groups” claim to your ID token.
Navigate to API > Authorization Servers, and click on the default server. Click the Claims tab and Add Claim. Name it groups, and include it in the ID Token. Set the value type to Groups and set the filter to be a Regex of ”.*” and click Create.
This is how JHipster does it. It also has a directive for showing/hiding sections. I created an issue to add something similar to our Angular SDK.
prasad sonu
Concepts are clearly explained! Great one !
Iam getting an error - "PUT http://localhost:8080/api/register 405
POST call in error HttpErrorResponse {headers: HttpHeaders, status: 405, statusText: “OK”, url: “http://localhost:8080/api/register”, ok: false, …}"
This is when im trying to do the POST request.
I ve added CORS filter too. But still getting this error.
Any suggestions or help ?
Thanks in advance
jjmkay
in your video you use httpie in the command line to create your spring boot app from the command line not using the initializer web site. can you post the code on this blog to do that and let people know about httpie which is a pretty cool command line tool. also I would put a warning on your previous demos with springboot+ng7 etc that they will totally fail if you have ng8 and also those demos don’t correctly connect to okta as the property keys have changed i see from trying this demo and it actually working.
Matt Raible
Hello Prasad,
It looks like you’re using URLs that aren’t used in this tutorial. For example, /api/register
. Are you embedding are sign-in widget and getting this error? I’m unsure where it’s coming from.
Matt Raible
The demo script for the video has the command you can use. My previous posts explicitly specific the version you should use, so I don’t think a warning is necessary.
Thanks for the feedback though! I really appreciate it. I’ll be creating a new tutorial for Angular 9 once it’s released.
jjmkay
In Java it is very easy to do a Java7 tutorial on a Java 8 JDK so I’m so used to backward compatibility. Guess angular does not have backwards compatibility.
Matt Raible
Angular has had pretty good backward compatibility since v5. What changed in the previous tutorial and this one was Spring Boot 2.0 vs Spring Boot 2.1. In 2.1, they added OIDC support directly to Spring Security, hence the property name changes. I wrote a post on Spring Boot 2.1 that might help. You might find Migrate Your Spring Boot App to the Latest and Greatest Spring Security and OAuth 2.0 useful as well.
AHMED SM
Thank you for this great tutorial, I have an error it says Property ‘name’ does not exist on type ‘CarListComponent’.
and I have searched and couldnt find a definition for Car properties Can you help me please
Matt Raible
You should be reading cars
from CarListComponent
, not name
. Make sure the “*ngFor” in your car-list.component.html
looks like the following:
<div *ngfor=“let car of cars”>
{{car.name}}
</div>
Josh Magdaleno
Is anybody else unable to install @oktadev/schematics ? I have tried using ng
and yarn
but I always getting an array saying it’s unable to find package-lock.json. So i remove node_modeles and my package-lock.json, and then run yarn install, after I again try to install @oktadev/schematics and It gives me the same issue.
Matt Raible
What error are you seeing? I haven’t had any problems lately.
Jazmin Perez
Hello Matt, thank you for the tutorial.
I am at the last step of the tutorial incorporating okta. I stopped and ran ng serve and I got this error:
Only initialized variables and constants can be referenced in decorators because the value of this variable is needed by the template compiler.
@okta/okta-angular/dist/src/okta/models/okta.config.ts(24,22): Error during template compile of ‘OKTA_CONFIG’
Only initialized variables and constants can be referenced in decorators because the value of this variable is needed by the template compiler.
…Invalid provider for the NgModule 'AuthRoutingModule
Do you know how I should go about this?
Adil Khan
Hi Matt,
Great tutorial; A lot a concepts are covered. I just wanted to know since you have included spring-data-rest as a dependency the responses should include fields like _links but the json object returned seems to be missing it.
Matt Raible
Hello Adil,
You are correct that if the data is returned from the CarRepository
class (that’s decorated with @RepositoryRestResource
), the JSON will contain _links, and no IDs. However, in this example, the /cool-cars
endpoint is from a Controller that returns a list of Car objects with no HATEOS behavior. When you edit, update, or delete a Car, the Car Repository is used and there’s _links. For example, in the CarEditComponent
:
ngOnInit() {
this.sub = this.route.params.subscribe(params => {
const id = params.id;
if (id) {
this.carService.get(id).subscribe((car: any) => {
if (car) {
this.car = car;
this.car.href = car._links.self.href;
this.giphyService.get(car.name).subscribe(url => car.giphyUrl = url);
} else {
console.log(Car with id '${id}' not found, returning to list
);
this.gotoList();
}
});
}
});
}
Lynn
Hello, I’m facing the same problem, were you able to fix it ?
ERROR in src\app\auth-routing.module.ts(43,16): Error during template compile of ‘AuthRoutingModule’
Only initialized variables and constants can be referenced in decorators because the value of this variable is needed by the template compiler in ‘OKTA_CONFIG’
‘OKTA_CONFIG’ references ‘OKTA_CONFIG’
‘OKTA_CONFIG’ is not initialized at @okta\okta-angular\dist\src\okta\models\okta.config.ts(24,22).
Matt Raible
Upgrading to the Okta Angular SDK v1.3.1 should fix this issue.
Lynn
thanks for the reply, I tried doing that, and it fixed the error indeed, yet I’m having more issues: when I try to login, it doesn’t redirect to okta, it takes me directly to “implicit/callback page” when I inspect it, this is what I got:
Error: Uncaught (in promise): AuthApiError
Error
at Object.<anonymous> (okta-auth-js.min.js:39)
at t (okta-auth-js.min.js:13)
Matt Raible
You might try removing node_modules and running npm install. If that doesn’t work, please enter an issue in our Angular SDK project on GitHub.