Before proceeding lets perform an additional prerequisite. Visit https://localhost:9999/
Proceed as shown next.
(A quick side note: Its possible to add proper ssl certificates into pingfederate and is very straightforward. Not covering that here. )
Click on the menu item corresponding to Certificate is not valid as shown above.
This will launch the certificate viewer.
Showing below a partial screen of same.
Lets visit the details tab.
Press the "Export" button.
This will launch File save as dialog for the crt file.
keytool -import -trustcacerts -file localhost.crt -alias localpingfed -keystore %JAVA_HOME%/lib/security/cacerts -storepass changeit
On linux: sudo keytool -import -trustcacerts -file localhost.crt -alias localpingfed -keystore $JAVA_HOME/lib/security/cacerts -storepass changeit
Also ensure name of the file "localhost.crt" matches with actual including the file name extension.
When prompted enter yes
springboot.oidc.with.angular is a maven project. Its also a submodule of pingfed-automation\oidc-check.
It should have been already built. However we need to build it properly with its angular parts.
In command prompt or terminal navigate to the usual pingfed-automation folder.
Run the below command.
.\gradlew :oidc-check:springboot.oidc.with.angular:bootRun
This should give a result as shown below.
Showing above how it launches.
Its a simple spring boot based project. Using angular for front end.
We are going to use this project to verify if we are able to obtain some access tokens from pingfederate.
Vist http://localhost:8081
Click Login
Note: Enter user.0 and password for the username and password.
Just the text - user.0 and password for username and password respectively.
Uncheck foo now. Press Allow.
Login should be successful.
The second link is a Protected route and appears only when logged in.
But both links have same functionality for this demo.
Click the first one.
Now check the "Show Innaccessible" checkbox.
The Access Foo Buton is now available even though it should not be.
Click all the buttons.
Notice how all the buttons work. But "Access Foo" button reported 403 and Problem.
If you logout and are at this page you will see even less buttons.
Again pressing the checkbox would show you all the buttons including the inaccessibble ones.
Pressing the inaccessible ones will report 401 as shown below.
Conclusion: We have seen how the login and scopes selection affects how the users can do what on the application.
You can also launch with application with a VM argument of -DisOn4200=true.
If you do that during development you can keep the server running at 8081 but front end at 4200. You could launch the application then at http://localhost:4200 when doing angular development.
A spring boot angular OIDC application can be done in different ways.
The approach taken here is the same approach used by back end web applications.
As can be seen here the SPA angular app is not a pure SPA. Its compromising on its SPA'ness during login.
Have deliberately chosen an approach where the front end, back end application are all in the same web app.
The main advanatage of this approach is that the access token never leaves the back end.
It never is made accessible to the angular javascript front end.
This is often a most recommended highly secure and compact approach- I am attempting here the The BFF Pattern (Backend for Frontend).
However this is not the only way.
There are other approaches also possible.
If needed one can also use Authorization Code with PKCE when working with Pure SPA or native applications where browser redirect is being avoided or not possible.
Depending on the requirements choose the appropriate approach.
Logout needs to use a pingfed logout endpoint. Note: Logout itself works.
Run below command to remove certificate from the trusted store. keytool -delete -alias localpingfed -keystore %JAVA_HOME%/lib/security/cacerts
This should remove the ssl certificate from the trust store.