# @reddotpay/rdp-sso

> SSO module for frontend

Latest version **0.2.20** (published 2019-06-14) · 0 weekly downloads

## Install

```sh
npm install @reddotpay/rdp-sso
pnpm add @reddotpay/rdp-sso
yarn add @reddotpay/rdp-sso
bun add @reddotpay/rdp-sso
```

## Health

**Score 10/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.20 |
| Published | 2019-06-14 |
| First published | 2019-01-22 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 17.4 KB |
| Known vulnerabilities | 0 (+28 in 2 direct dependencies) |
| Install scripts | no |
| Maintainers | gianebao, leroyleejh |
| Keywords | rdp-sso, npm, package, reddotpay |

## Links

- npm: https://www.npmjs.com/package/@reddotpay/rdp-sso
- Repository: https://github.com/reddotpay/rdp-sso
- Homepage: https://github.com/reddotpay/rdp-sso#readme
- Issues: https://github.com/reddotpay/rdp-sso/issues
- npm.io page: https://npm.io/package/@reddotpay/rdp-sso

## Dependencies (2)

- [axios](https://npm.io/package/axios.md) ^0.19.0
- [jsonwebtoken](https://npm.io/package/jsonwebtoken.md) ^8.5.1

## Recent versions

- 0.2.20 (latest) — 2019-06-14
- 0.2.19 — 2019-06-10
- 0.2.18 — 2019-03-29
- 0.2.17 — 2019-02-12
- 0.2.16 — 2019-02-12
- 0.2.15 — 2019-02-12
- 0.2.14 — 2019-02-12
- 0.2.13 — 2019-02-07
- 0.2.12 — 2019-02-07
- 0.2.11 — 2019-01-31
- 0.2.10 — 2019-01-30
- 0.2.8 — 2019-01-29
- 0.2.7 — 2019-01-23
- 0.2.6 — 2019-01-22

## README

# rdp-sso
[![npm (scoped)](https://img.shields.io/npm/v/@reddotpay/rdp-sso.svg)](https://www.npmjs.com/package/@reddotpay/rdp-sso)

SSO package for RDP products

## Install
```
npm install @reddotpay/rdp-sso
```

## Requirements
```
To be used with Vue 2.x and Vue-Router 3.x
```
#### Environment variables (build/buildenv.sh)
```
#!/bin/sh

PARENT_DIR=$( pwd -P )
PATH="${PARENT_DIR}/.env.development.local"
if [ "$1" == "prod" ]; then
	PATH="${CI_PROJECT_DIR}/frontend/.env.production"
fi

echo "VUE_APP_RDP_SSO_ENDPOINT=\"$RDP_SSO_ENDPOINT\"" >> $PATH
echo "VUE_APP_RDP_SSO_PAGE=\"$RDP_SSO_PAGE\"" >> $PATH
echo "VUE_APP_RDP_SSO_PUB=\"$RDP_SSO_PUBLIC_KEY\"" >> $PATH
echo "VUE_APP_RDP_SSO_ISS=\"$RDP_SSO_ISS\"" >> $PATH
echo "VUE_APP_RDP_SSO_SHORTKEY_TIMEOUT=\"$RDP_SSO_SHORTLIVE_TIMEOUT\"" >> $PATH
```

#### CSP
Allow `$RDP_SSO_CSP` in connect-src CSP

Create a few files below to use
#### auth.vue
Page to perform SSO token verification/exchange
```
<template>
</template>

<script>

export default {
	name: 'auth',
	mounted() {
		const vue = this;
		vue.$sso.checkSSO(vue.$router);
	}
}
</script>
```
#### login.vue
Page for callback URL from SSO after logging in
```
<template>
</template>

<script>

export default {
	name: 'login',
	mounted() {
		const vue = this;
		// omit vue.$router to use window.location for redirection
		vue.$sso.doLogin(vue.$route, vue.$router);
	}
}
</script>
```
#### Modify Router.js and add entry to routes
```
import Login from './views/login.vue'; // path to login.vue
import Auth from './views/auth.vue'; // path to auth.vue
routes: [
	{	// callback URL from SSO after logging in
		path: '/login',
		component: Login,
		name: 'login',
	},
	{	// URL to perform SSO token verification/exchange
		path: '/auth',
		component: Auth,
		name: 'auth',
	},
]
```

## Usage

#### main.js
```
import Vue from 'vue';
import SSO from '@reddotpay/rdp-sso';

Object.defineProperty(Vue.prototype, '$sso', { value: SSO });

router.beforeEach((to, from, next) => {
	// this line of code is to handle the hashed url properly, since we are not using history mode
	if (window.location.pathname.length >= 2) {
		window.location = `${window.location.origin}/#${window.location.pathname}${window.location.search}`;
	}

	// the entry point for SSO
	// SSO will redirect to optionalDefaultPath after login (/some-path)
	SSO.init(to, from, router, optionalDefaultPath);
	next();
});
```

#### To logout
```
const vue = this;
// supply a callback function to doLogout for redirect
vue.$sso.doLogout(function() {
	// vue.$router.push({ name: 'home' });
	// vue.$router.push({ path: '/' });
});
```

#### To get user's data
```
export default {
	mounted() {
		const vue = this;
		const userDataObj = vue.$sso.getSSOData();
	}
}
```
##### sample userDataObj
```
{
	"rdp_username": "test@test.com", // email address of the user when signing up
	"rdp_firstname": "test", // first name of the user when
	"rdp_lastname": "test", // last name of the user
	"rdp_company": "test", // companyID used to log in
	"rdp_companyName": "test", // company name entered when user signs up
	"rdp_groupID": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx", // company UUID (used for MAM)
	"rdp_role": "merchant-admin"|"merchant-staff" // role of user
	"rdp_uuid": "xxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx", // UUID of user (used for permissions etc)
	"rdp_auth": "auth", // sso variables
	"rdp_merchantID": "{ Staging: [merchantID1, merchantID2, ...] | '*',
						Production: [merchantID1, merchantID2, ...] | '*'
						}", "// array of MerchantID | or '*' ('*' represents all MerchantID) that this user has permission
	"iat": xxxxxxxx, // sso variables
	"iss": "xxxxx" // sso variables
}
```
To retrieve user data
```
const vue = this;

const userID = vue.$sso.getUserID(); // user unique identifier within the system
const userName = vue.$sso.getUserName(); // user email
const userFirstName = vue.$sso.getUserFirstName(); // user first name
const userLastName = vue.$sso.getUserLastName(); // user last name
const companyID = vue.$sso.getCompanyID(); // company ID used to log in to SSO
const companyName = vue.$sso.getCompanyName(); // company name entered by user when signing up
const companyGroupID = vue.$sso.getCompanyGroupID(); // company group ID tied to MAM and other services
const merchantID = vue.$sso.getMerchantID(); // Object of Staging & Production array of merchantIDs or *
const stagingMerchantID = vue.$sso.getMerchantIDStaging(); // array of staging merchantIDs
const productionMerchantID = vue.$sso.getMerchantIDProd(); // array of production merchantIDs
const userRole = vue.$sso.getUserRole(); // role of user
```

#### To get userToken
```
export default {
	mounted() {
		const vue = this;
		const userDataObj = vue.$sso.getSSOToken();
	}
}
```

#### To read permissions
```
export default {
	mounted() {
		const vue = this;
		const permissionsObj = vue.$sso.getPermissions();
	}
}
```

---
_Source: https://npm.io/package/@reddotpay/rdp-sso · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._