Installing the SDK
The Paragon SDK can be imported in your front-end JavaScript to embed the Connect Portal and trigger workflows in your application.
You can install the Paragon SDK with npm:
npm install @useparagon/connect
The SDK can be imported in your client-side JavaScript files as a module:
import { paragon } from '@useparagon/connect';
If you are using an on-prem/single-tenant instance of Paragon, you can call the
.configureGlobal function to point the SDK to use the base hostname of your Paragon instance.import { paragon } from '@useparagon/connect';
// If your login URL is https://dashboard.mycompany.paragon.so:
paragon.configureGlobal({
host: "mycompany.paragon.so"
});
If you are migrating from using the <script> tag to the npm package, please note that
paragon is no longer exposed as a global or on the window object by default.Any references to
paragon or window.paragon must be updated to point to the package import:+ import { paragon } from '@useparagon/connect';
- window.paragon.authenticate(...);
+ paragon.authenticate(...);
Before using the Paragon SDK, you'll need to set up your application to verify the identity of your users to the SDK.
Paragon verifies the identity of your users using the authentication system you're already using, including managed services like Firebase or Auth0. Some backend code may be required if your application implements its own sign-in and registration.
If your application implements its own authentication backend, follow the steps in Setup with your own authentication backend.
If you use a managed authentication service like Firebase Authentication or Auth0, follow the steps in Setup with a managed authentication service.
If you use your own backend server to manage authentication, you'll first need to complete the following steps:
To generate a Signing Key, go to Settings > SDK Setup in your Paragon dashboard. You should store this key in an environment secrets file.
For security reasons, we don’t store your Private Key and cannot show it to you again, so we recommend you download the key and store it someplace secure.
Next, you'll need to generate a Paragon User Token for each of your authenticated users. To do this, you'll need a library in your target language to sign JWTs with RS256. You can find one in your language at https://jwt.io/.
If your application is a fully client-rendered single-page app, you may have to create and use an additional API endpoint to retrieve a signed JWT (or reuse an existing endpoint that handles authentication or user info).
The signed JWT/Paragon User Token minimally must include the
sub, iat, and exp claims:JavaScript
{
// Uniquely identifying key for a user
"sub": "the-user-id",
// Issue timestamp, should be the current time
"iat": 1608600116
// Expiry timestamp for token, such as 1 hour from time of signature (iat)
"exp": 1608603716
}
Use the Paragon JWT Generator to generate test JWTs for your development purposes. In production, static tokens should never be used.
You'll call
paragon.authenticate in your view with a JWT signed by your backend using the library chosen in Step 2. This JWT is the Paragon user token.await paragon.authenticate(
// You can find your project ID in the Overview tab of any Integration
"38b1f170-0c43-4eae-9a04-ab85325d99f7",
// See Setup for how to encode your user token
"eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.ey..."
);
The
paragon.authenticate function is Promiseable and resolves when the SDK has successfully authenticated your user. Note that other functions, like paragon.connect, may not work as expected until this Promise has resolved.
Example Implementation: A Node.js and Express app using Handlebars view templating
- 1.Adding middleware to sign the JWT and include it in the response context// server.js - Adding middleware to sign an authenticated user's tokenconst jwt = require('jsonwebtoken');app.use((req, res, next) => {if (!req.user) {return next();}// JWT NumericDates specified in seconds:const currentTime = Math.floor(Date.now() / 1000);res.locals({paragonToken: jsonwebtoken.sign({sub: req.user.id, // Your user's or their company's IDiat: currentTime,exp: currentTime + (60 * 60), // 1 hour from now},process.env.PARAGON_SIGNING_KEY,{algorithm: "RS256",}),});next();});
- 2.Use the
paragonJwtset in context within the view template, with a call toparagon.authenticate:// layout.hbs - Include paragon.authenticate call in the view template<body><script type="text/javascript">paragon.authenticate("project-id", "{{ paragonToken }}").then(() => {// paragon.getUser() will now return the authenticated user});</script></body>
You can set up managed authentication for your Paragon project by navigating to Settings > SDK Setup and selecting an integration provider.
Since Paragon uses a JSON Web Token (JWT) to encode and validate user identity, many managed services will already have a token that you can pass directly to Paragon.
Firebase Authentication
Auth0
You'll need to provide Paragon with your Firebase Project ID, which you can find in the Firebase Console.
The Firebase ID token can be used directly as the Paragon user token.
firebase.auth().currentUser.getIdToken(true).then(async function(idToken) {
await paragon.authenticate("project-id", idToken);
})
You'll need to provide Paragon with your Auth0 Tenant Domain, which you can find ends with
.auth0.com. Example: https://<YOUR_TENANT>.auth0.com.If you have a domain alias for your tenant domain, use the domain alias instead.
The Auth0 ID token can be used directly as the Paragon user token.
Auth0 provides comprehensive docs on retrieving the ID token in various contexts. An example of this, using their single page app SDK:
auth0.getIdTokenClaims().then((claims) => {
await paragon.authenticate("project-id", claims.__raw);
});
Last modified 1mo ago