How to set-up WSO2 Identity Server User Portal in an development environment
The upcoming WSO2 Identity Server version 5.10.0 will have redesigned UIs with improved UX. The Dashboard has been deprecated and been replaced with a new User Portal. The overall appearance has also been upgraded to maintain consistency across the product.
In order to achieve the above, a centralized theming mechanism is a must. Therefore, all the front-end portals have been moved to a single mono-repo called “Identity Apps” (https://github.com/wso2/identity-apps).
When the final version of the WSO2 Identity Server 5.10.0 is released, the user portal will be available under the following URl.
http(s)://SERVER_HOST/t/TENANT_DOMAIN/user-portal
If you are planning on setting up the repo in a development environment follow the steps below.
Pre-requisites
- Install node if you haven’t already(npm is already bundled with node).
- Install maven (Needed to run mvn commands).
- A running Identity Server v 5.10. (If you want to build from the source follow the instructions listed here).
Configuring Identity Server
Default dev origin, hostname and port set for the User Portal is https://localhost:9000. So the following configurations will have to change accordingly if you change the port or any other configurations.
- Allowing Cross-Origin requests to the Identity Server.
Cross-origin requests will be blocked by default as a security measure. So you have to put the following CORS filter to the following config file in the WSO2 Identity Server distribution pack.
<IS_HOME>/repository/resources/conf/templates/repository/conf/tomcat/web.xml.j2
2. Add your hostname and port as a trusted FIDO2 origin.
Whitelist the dev URL in the FIDO configurations found in the following file.
<IS_HOME>/repository/resources/conf/templates/repository/conf/identity/identity.xml.j2
3. Restart the Identity Server.
4. Configure the callback URLs for the User Portal.
Log in to the management console https://SERVER_HOST/carbon
Go to service provider listing and click on edit in User Portal portal list item.
In the edit view, expand the “Inbound Authentication Configuration” section, and further expand the “OAuth/OpenID Connect Configuration”. Click on edit under User Portal list item.
You can simple change the port to 9000 or you can add a regexp as follows.
regexp=(https://localhost:9443/user-portal/login|https://localhost:9000/user-portal/login)
Building the Identity Apps repo
You can fork the original repo or directly clone the original repo and start working on it, but I suggest you create your own fork.
git clone https://github.com/brionmario/identity-apps
cd identity-apps
mvn clean install or npm run build
Running the User Portal in dev mode
After the build is finished, navigate to the user portal directory and run the portal using the webpack dev server.
cd apps/user-portal
npm start
The portal will be served from https://localhost:9000/user-portal
Signing off… ✌️❤️