React.js Single Sign-On (SSO) using WordPress As OpenID Connect Server

WordPress OAuth Server plugin enables Single Sign-On (SSO) into the React. js using your WordPress username and password. Once you configure the React. js with WP OAuth Server plugin, you can login to your React. js application using WP credentials. OAuth Server plugin also allows you to send custom WordPress user attributes to your React. js app as per your requirements. To know more about other features we provide in WP OAuth Server plugin, you can click here.

Download And Installation

• Log into your WordPress instance as an admin.
• Go to the WordPress Dashboard -> Plugins and click on Add New.
• Search for a WordPress OAuth Server Single Sign-On (SSO) plugin and click on Install Now.
• Once installed click on Activate.

Steps to configure WordPress Login into React.js

1. Setup React.js as OAuth Client

• You will need to integrate the OAuth Server APIs into the React.Js application in order to enable the SSO.
• After integrating the OAuth Server APIs in your react application, copy the Redirect URL and keep it handy you will need it later.
• Provide the client ID, the client secret, and other information that is required. (Refer to the below table).

Client ID :	Click Here
Client Secret :	Click Here
Scope:	profile openid
Authorize Endpoint:	https://< your-wordpress-domain >/wp-json/moserver/authorize
Access Token Endpoint:	https://< your-wordpress-domain >/wp-json/moserver/token
Get User Info Endpoint:	https://< your-wordpress-domain >/wp-json/moserver/resource

• Now, click on Save button.

2. Setup WordPress as OAuth Server

• Go to miniOrange OAuth Server on the left side menu.
• Now, search for your required OAuth Client(i.e. React).
• Click on the React icon.

• Enter Client name as you want. Get the Redirect / Callback URL from React.js and enter under Authorized Redirect URI field. Click on Save client button.

• Note down Client ID, Client Secret, Endpoints and Scope to configure in your OAuth Client.

In this Guide, you have successfully configured Single Sign-On (SSO) into React.js with WordPress as OAuth Provider and React.js as OAuth Client using our WP OAuth Server plugin.This solution ensures that you are ready to roll out secure access to your React.js using WordPress site credentials within minutes.