This exercise explores modern user and microservice security. Specifically, this exercise enables the following:
- A web app that provides the user interface through the web browser and leverages externalize Authentication services based on IBM Cloud App ID OpenID Connect (OIDC) services. Specifically, the web app leverages the OIDC Authorization Grant Type.
- A Java microservice that implements the Backend-for-frontend (BFF) pattern. The BFF and OIDC integration are implemented by using the Spring Boot Framework and Spring Security related frameworks. This microservice is packaged as a container leveraging Eclipse JKube automatic source-to-image and deployed to a Red Hat OpenShift CodeReady Container.
- The Java Resource microservices returns a simple message. The microservice is implemented by using the Spring Boot Framework and Spring Security related frameworks. This microservice is packaged as a container leveraging Eclipse JKube automatic source-to-image and deployed to a Red Hat OpenShift CodeReady Container.
- The microservice-to-microservice security between the BFF and Resource microservice leverages the OIDC JSON Web Tokens (JWT) and the Java Web KeySet (JWKS) Public Keys.
NOTE: The monolith application is based on the Spring Security and Angular Tutorial.
Cloud Friendly capabilities supported by this exercise:
| Capabilities | Supported |
|---|---|
| No Permanent disk access | Yes |
| Self-contained application | Yes |
| Platform-managed ports and networking | Yes |
| Consumes platform-managed backing services | Yes |
| 12 Factor App methodology | Yes |
| Horizonal scalable | Yes |
| Leverages platform for high availability | Yes |
Technology Stack
- Spring Boot (v2.1.8) with embedded Tomcat
- NodeJS
- Angular 8.2.x
- OpenShift CodeReadyContainer
- IBM Cloud App ID
- NodeShift
- Jkube
We'll explore turning the application into a cloud friendly solution by breaking up the legacy-ui app, introducing the backend-for-frontend pattern, leveraging an external authentication service and introducing microservice security.
-
Optional: If you do not have Git client installed, go to the Git client downloads website to download and install the Git client.
NOTE (Windows Users): During install, on the
Choosing HTTPS transport backendstep, selectUse the native Windows Secure Channel library.
-
Verify Java Installation with the following command:
java -fullversion
-
Optional: If you do not have Java installed, go to the Java SE Development Kit 8 Downloads website to download and install Java.
NOTE: During installation, change installation to c:\ ( e.g. C:\jdk1.8.0_251 )
-
Add
JAVA_HOMEsystem environment variable that point to your base java folder path (e.g., C:\jdk1.8.0_251 )
-
Verify NodeJS Installation with the following command:
npm -version
Optional: If you do not have NodeJS installed, go to the NodeJS website to download and install NodeJS.
-
Optional If you do not have Visual Studio Code installed, go to the Visual Studio Code Download website to download and install the Visual Studio Code.
-
Install Visual Studio Code Extensions:
-
You must have an IBM Cloud account. If you don't have one, sign up for a trial. The account requires an
IBMid. If you don't have anIBMid, you can create one when you register. -
Setup
App ID, the IBM OpenID Connect (OIDC) service-
Create
App ID- Open Browser to Create AppID
- Under
Select a region, confirm or selectDallasand click theCreatebutton
-
Setup
Cloud Identity Provider-
Within App ID page, click
Manage Authenticationand perform the following:-
Disablethe following Identity Providers:Facebook, Google, Anonymous -
Confirm the following is
enabled:Cloud Directory
-
-
-
Add
web redirect URLs-
Within App ID page, click
Manage Authentication->Authentication Settings. UnderAdd web redirect URLs, add the following URLs:-
Add
http://localhost:8080/loginand click thePlusbutton -
Add
http://modern-bff-cloudfriendly-security.apps-crc.testing/loginand click thePlusbutton
-
-
-
Setup
Cloud Directory:-
Within App ID page, click
Cloud Directory->Settings. UnderAllow users to sign-up and sign-in using:selectUsername and password -
Within App ID page, click
Cloud Directory->Users. ClickCreate User, complete form and clickSaveIMPORTANT: Note
usernameandpasswordfor later use
-
-
Add OIDC client app
- Within the App ID page, click
Applicationsand clickApp Application. - Enter and select the following:
Name:
gm4cappmod-appType:Regular web application - Click
Save - Expand
gm4cappmod-appand note the following for later useclientIdsecretoAuthServerUrl
- Within the App ID page, click
-
-
Clone cloudfriendly-app-security.git GIT repo
git clone https://us-south.git.cloud.ibm.com/gm4c-mod/cloudfriendly-app-security.git cd cloudfriendly-app-security
-
Minimum hardware requirements:
- 4 CPUs or more
- 9 GB of memory available or more
- 35 GB of storage space available or more
-
Install on Laptop: Red Hat CodeReady Containers
NOTES:
a. Requires Red Hat Developer credentials, which gives you access to developer tools and programs via Red Hat Developer. To sign-up, click the
Log Inlink on the top right of the page and then click theCreate one nowlink.b. Perform Chapter 2. Installation
c. (Optional - Windows) On windows, you will need to reboot after
crc setupif you have not enabled Hyper-V before. Reboot is required to enable the Hyper-V feature.d. (Optional - Windows) On windows, if
crc startfails, performcrc delete,rmdir .crcthencrc setupandcrc start.e. (Optional - Windows) On windows, if you observe
error pinging docker registry quay.ioerror within OpenShift events, performcrc stop, thencrc start -n 1.1.1.1 -
Confirm OpenShift CRC
runningon the local machine:crc status
-
Open
cloudfriendly-app-securityinside Visual Studio Code- Open Visual Studio Code
- File->Open Workspace... -> cloudfriendly-app-security.code-workspace
-
Open
.vscode/launch.jsonand replaceREPLACE_WITH_CLIENT_ID,REPLACE_WITH__SECRET, andREPLACE_WITH_OAUTH_SERVER_URLwith registeredApp IDapp info:-
Replace
REPLACE_WITH_CLIENT_IDwithclientIddata saved from IBM App ID, Pre-reqs step 4. -
Replace
REPLACE_WITH_SECRETwithsecretdata saved from IBM App ID, Pre-reqs step 4. -
Replace
REPLACE_WITH_OAUTH_SERVER_URLwithoAuthServerUrldata saved from IBM App ID, Pre-reqs step 4.NOTE: Two locations in .vscode/launch.json file
-
-
Run resource-ms locally. Within Visual Studio Code:
- Expand SPRING-BOOT DASHBOARD, click the refresh icon, right mouse click on resource-ms and click Start
-
Run modern-bff locally. Within Visual Studio Code:
- Expand SPRING-BOOT DASHBOARD, click the refresh icon, right mouse click on modern-bff and click Start
-
Run modern-ui locally. Within Visual Studio Code:
-
Install
modern-uidependent npm modules:-
Select
Terminalfrom menu bar, thenRun Task...and selectnpm: install:all - modern-uiNOTE: Check Terminal and enter an appropriate response to
Would you like to share anonymous usage data with the Angular Team at Google ...question, if prompted
-
-
Build
modern-uiangular content:- Select
Terminalfrom the menu bar, thenRun Task...and selectnpm: build:content - modern-uiand selectContinue without scanning the task output
- Select
-
Run
modern-uinode app:- Select
Terminalfrom the menu bar, thenRun Task...and selectnpm: start - modern-uiand selectContinue without scanning the task output
- Select
-
-
Open browser to http://localhost:4200
-
Click Login, enter your username and password and click submit:
-
Click Details. You should observe ID and content information
-
Open a Terminal or Windows
Git Bashwindow, create an OpenShift project as thedeveloperusereval $(crc oc-env); oc login -u developer -p developer --server=https://api.crc.testing:6443 --insecure-skip-tls-verify oc new-project cloudfriendly-security
-
Create OIDC
gm4cappmod-appsecret-
Copy template-app-id.env to gm4cappmod-app.env
-
Edit
gm4cappmod-app.env- Replace
REPLACE_WITH_OAUTH_SERVER_URLwithoAuthServerUrldata saved from IBM App ID, Pre-reqs step 4. - Replace
REPLACE_WITH_CLIENT_IDwithclientIddata saved from IBM App ID, Pre-reqs step 4. - Replace
REPLACE_WITH_SECRETwithsecretdata saved from IBM App ID, Pre-reqs step 4.
- Replace
-
Create gm4cappmod-app secret on OpenShift
oc create secret generic gm4cappmod-app --from-env-file=gm4cappmod-app.env
-
-
Deploy resource-ms microservice application to OpenShift
-
Build and deploy resource-ms microservice to OpenShift. Within the Terminal or Windows
Git Bashwindow, perform the following:cd resource-ms # Create your OpenShift resource descriptors # Build component and start S2I build # and Deploy your microservice on Openshift cluster ./mvnw clean package oc:deploy -Popenshift
NOTE:
- Ignore
ERROR(s) denoting cannot extract Git information - When deploying additional code or configuration changes, perform the following after running
oc:deploy
oc rollout latest resource-ms
- Ignore
-
Check the status of
resource-msappoc status
NOTE: Might need to repeat the command until it displays
deployment #1 running
-
-
Deploy modern-bff microservice application to OpenShift
-
Build and deploy modern-bff microservice to OpenShift. Within the Terminal or Windows
Git Bashwindow, perform the following:cd ../modern-bff # Create your OpenShift resource descriptors # Build component and start S2I build # and Deploy your microservice on Openshift cluster ./mvnw clean package oc:deploy -Popenshift
NOTE:
- Ignore
ERROR(s) denoting cannot extract Git information - When deploying new code or configurations changes, perform the following after running
oc:deploy
oc rollout latest modern-bff
- Ignore
-
Check the status of
modern-bffappoc status
NOTE: Might need to repeat the command until it displays
deployment #1 running
-
-
Deploy modern-ui microservice UI application to OpenShift
-
Build and deploy modern-ui microservice to OpenShift. Within the Terminal or Windows
Git Bashwindow, perform the following:cd ../modern-ui npm run install:all npm run build:content npm run nodeshift oc expose svc/modern-ui -
Check the status of
modern-uiappoc status
NOTE: Might need to repeat the command until it displays
deployment #1 deployed
-
-
Open browser to
modern-ui-
Open browser to http://modern-ui-cloudfriendly-security.apps-crc.testing
-
Click Login, enter the following and click submit:
username:
<your username>password:
<your password> -
Click
Details. You should observe ID and content information
-
