OAuth

---

The OAuth framework facilitates the user authentication process. It authorizes access to the user's data from various services (such as social media platforms, cloud storage, etc.) without requiring users to reveal their login credentials.

---

OAuth Properties

Property	Description
Disabled [Checkbox]	Deactivates the OAuth widget.
Client ID	The unique identifier assigned to your application by the OAuth provider. Note: To obtain a Client ID, you'll need to register your application with the provider.
Client Secret	The secret string of characters designated to the Client ID.
Scope	A list of permissions that your application requests from the OAuth provider. It determines the actions that your application can perform on behalf of the user.
State	A value sent with the OAuth request and returned by the provider in the response. It is used to confirm the request originated from your application.
Redirect URL	Users are redirected to this URL after the login authentication.
Logout [Checkbox]	Enables "logout" (if available) from the third-party application or service.

API Methods

setDisabled

Sets the Disabled flag for this component.

Method

setDisabled(visible: boolean): void

Usage

// Setting the Disabled to "true" enables the element
a8forms.oAuth("oAuthId").setDisabled(true)

// Setting the Disabled to "false" deactivates the element
a8forms.oAuth("oAuthId").setDisabled(false)

setVisibility

Sets the Visibility flag for this component.

Method

setVisibility(visible: boolean): void

Usage

// Setting the visibility to "true" makes the element visible
a8forms.oAuth("oAuthId").setVisibility(true)

// Setting the visibility to "false" makes the element invisible
a8forms.oAuth("oAuthId").setVisibility(false)

setVisibilityCondition

Sets the visibility condition for this component.

Method

setVisibilityCondition(condition: string): void

Usage

// Sets a condition for changing the element's visibility status.
a8forms.oAuth("oAuthId").setVisibilityCondition("1 === 1")

---

Event Handlers

onLogin

onLogin - Sets the OAuth provider's "User Login" URL.

Spotify

async function main(clientId, redirectUri, scope, state, asset) {
// Start of editable area
const url = `https://accounts.spotify.com/authorize?response_type=code&client_id=${clientId}&scope=${scope}&redirect_uri=${redirectUri}&state=${state}`
return url
// End of editable area
}

DigiLocker

async function main(clientId, redirectUri, scope, state, asset) {
// Start of editable area
const url = `https://api.digitallocker.gov.in/public/oauth2/1/authorize?client_id=${clientId}&response_type=code&redirect_uri=${redirectUri}&state={unique_identifier}`
return url
// End of editable area
}

onToken

onToken - Generates the "Access Token" with the OAuth provider.

Spotify

async function main(code, clientId, clientSecret, scope, state, redirectUri, asset) {
// Start of editable area
const params: any = {
        grant_type: 'client_credentials',
        code: code,
        redirect_uri: "http://localhost:3000",
        client_id: clientId,
        client_secret: clientSecret,
}
const formData = new URLSearchParams();
Object.keys(params).forEach((key) => {
        formData.append(key, params[key])
})
const response = await fetch('https://accounts.spotify.com/api/token', {
        method: 'POST',
        body: formData,
        headers: {
                "Content-Type": 'application/x-www-form-urlencoded',
                "Authorization": 'Basic ' + (window.btoa(clientId + ':' + clientSecret))
        },
}).then(response => response.json())
        .then(data => { return data });;
// End of editable area
}   

DigiLocker

async function main(code, clientId, clientSecret, scope, state, redirectUri, asset) {
// Start of editable area
const params: any = {
        grant_type: 'client_credentials',
        code: code,
        redirect_uri: "http://localhost:3000",
        client_id: clientId,
        client_secret: clientSecret,
}
const formData = new URLSearchParams();
Object.keys(params).forEach((key) => {
        formData.append(key, params[key])
})
const response = await fetch('https://api.digitallocker.gov.in/public/oauth2/1/token', {
        method: 'POST',
        body: formData,
        headers: {
                "Content-Type": 'application/x-www-form-urlencoded',
                "Authorization": 'Basic ' + (window.btoa(clientId + ':' + clientSecret))
        },
}).then(response => response.json())
        .then(data => { return data });;
// End of editable area
}   

onLogout

onLogout - Sets the "Logout" URL (revokes user-access) for the OAuth provider.

Spotify

async function main(clientId, redirectUri, scope, state, asset) {
// Start of editable area
const url = `https://www.spotify.com/logout/`
return url
// End of editable area
}