I have a Angular 13 app I am working on and need to integrate Okta into it. I have followed every tutorial I can find out there and there seems to be a discrepancy in what is in @okta/okta-angular and @okta/okta-auth-js. When following the tutorials, I can get the sign in widget to show but nothing can happen because when I add oktaAuth to my login component and add it to the providers array I get runtime errors like:
core.mjs:6495 ERROR Error: Can’t resolve all parameters for e: (?).
or if I remove it from the providers array but add it in the constructor I get:
core.mjs:6495 ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(PagesModule)[e → e → e → e]:
NullInjectorError: No provider for e!
Without OktaAuth I am unable to call functions like signInAndRedirect().
So my question is am I missing something? Are the libraries incompatible with angular 13? I really just hope I’m missing something. I can post any code needed and I can also post the entire stack traces from the browser if that helps.
Thanks in advance for any help, This is a complicated subject.
This was a big help, thanks, I didn’t find that example today while searching… I am however now getting a new error. I’ve double checked all the URL’s from the developer portal also.
The Help Center says:
This error is returned because the value of ${redirect_uri} used in authorize request is not registered in the Open ID client in Okta, as an allowed Login Redirect URI
This is what is in my dev portal setup:
And I have double check that this is the URL that is getting sent
This is my constructor and I just hard coded the URL in there to make sure:
I feel at this point that the code is correct as I have it coded at least, but I have not configured the account correctly or something. Thanks for your help earlier.
The Redirect URI looks correct. Do you have a default authorization server under Security > API?
This is what I have Security > API
And I do have the OctaCallbackComponent on the login/callback route.
When you see the 400 error, you can copy the URL in the address bar and look for the redirect_uri parameter. Compare the value being sent with what you have configured. Maybe there’s an extra space or something that’s being sent.
1 Like
Ok, where does the #tab-general come from?
The clientID is the same, I’m assuming the rest of the URL is formed on an Okta server.
OK, I just read closer and you wanted me to look at the redirect_uri and it IS different… its showing only http://localhost:4200/ and is leaving off the /login/callback pieces
the only place in the dev portal that I even have the base url of localhost:4200 is for the log-out redirect
UPDATE: That is not true… Core CORS I have the trusted origins set to http://localhost:4200
Ok, I downloaded your app you sent me from github and added my information and it worked. So I went through my app and the only thing differnet is I added a baseUrl to oidc in the config. I removed that and i’m not getting a 400 anymore. If that is stated somewhere and I just missed it, then ok, but if its not stated somewhere it might need to be. If developers are adding anything else into the config file that isn’t supposed to be there it could be causeing issues.
