How to use an external login page(say my React login page) to login using WSO2

Viewed 79

I did dome research about WSO2 OIDC but what I found is rather than use my own login page I can only just customize the login page only Is there any method to use my froundend page to let me have the full control of the layout

2 Answers

Contrary to what you have mentioned, you can actually modify the layout of the SSO page by tinkering with these two files:

  1. https://github.com/wso2/identity-apps/blob/master/apps/authentication-portal/src/main/webapp/login.jsp
  2. https://github.com/wso2/identity-apps/blob/master/apps/authentication-portal/src/main/webapp/basicauth.jsp

However, if you still insist on using your React app, you can use the password grant to build your own React-based login page. But there are several caveats:

  1. You cannot use multi-factor authentication or social media login since the user is not going to be redirected to the identity server during the authentication process.
  2. It should only be used with first-party applications that you trust.
  3. It compromises the security of your application and it is not recommended to be used by OAuth 2.0

Personally, I would not want to use this grant but I wanted to let you know this option exists if you insist on handling authentication yourself.

Authentication endpoint (login portal) is tightly bound to Servlet technologies as of the latest release. You can find how to host it external on any servlet container (e.g. Tomcat) here

There is an improvements suggested to allow it to developed using any technology including ReactJs, exposing API set for authentication flow. However this has not been prioritised yet.

Hence you can use the existing Servlet/JSP way for your research. This may seem bit harder than using ReactJS, yet is the best way available at present.

Related