Back

How to build a public Delighted integration: Building the Auth Flow

Aug 16, 20246 minute read

Hey there, fellow JavaScript enthusiast! Ready to dive into the world of Delighted integrations? Let's roll up our sleeves and build an auth flow that'll make your users smile.

Introduction

Delighted is a powerhouse for gathering customer feedback, and integrating it into your app can be a game-changer. But here's the thing: we need to make sure our integration is secure and user-friendly. That's where a solid auth flow comes in. It's like the bouncer at an exclusive club – keeping the riffraff out while letting the VIPs (your users) breeze right through.

Prerequisites

Before we jump in, make sure you've got:

  • Your Delighted API credentials (don't lose those!)
  • A Node.js and Express.js setup (I know you've got this)
  • A basic grasp of OAuth 2.0 (it's not as scary as it sounds, promise)

Setting up the Authorization Flow

First things first, let's get our OAuth 2.0 client ready to party:

const { AuthorizationCode } = require('simple-oauth2'); const client = new AuthorizationCode({ client: { id: process.env.DELIGHTED_CLIENT_ID, secret: process.env.DELIGHTED_CLIENT_SECRET, }, auth: { tokenHost: 'https://api.delighted.com', authorizePath: '/oauth/authorize', tokenPath: '/oauth/token', }, });

Now, let's craft that authorization URL:

const authorizationUri = client.authorizeURL({ redirect_uri: 'http://localhost:3000/callback', scope: 'survey.responses:read survey.responses:write', });

Implementing the Authorization Endpoint

Time to handle that initial authorization request:

app.get('/auth', (req, res) => { res.redirect(authorizationUri); });

Boom! Your users are now being whisked away to Delighted's authorization page. Fancy, right?

Handling the Callback

When Delighted sends your users back, be ready to catch them:

app.get('/callback', async (req, res) => { const { code } = req.query; try { const tokenParams = { code, redirect_uri: 'http://localhost:3000/callback', }; const accessToken = await client.getToken(tokenParams); // Store this token securely - we'll get to that in a sec res.send('Authentication successful!'); } catch (error) { console.error('Access Token Error', error.message); res.status(500).json('Authentication failed'); } });

Token Management

Now, let's talk about keeping those tokens safe and fresh:

// Store the token securely - please use a proper database in production! let tokenStore = {}; function saveToken(token) { tokenStore = token; } async function refreshToken() { try { const accessToken = client.createToken(tokenStore); if (accessToken.expired()) { const newToken = await accessToken.refresh(); saveToken(newToken.token); return newToken; } return accessToken; } catch (error) { console.error('Error refreshing access token:', error.message); } }

Making Authenticated Requests

Time to put those tokens to work:

async function makeDelightedRequest(endpoint) { const token = await refreshToken(); const response = await fetch(`https://api.delighted.com/v1/${endpoint}`, { headers: { Authorization: `Bearer ${token.access_token}`, }, }); return response.json(); }

Best Practices

Remember, with great power comes great responsibility:

  • Keep your secrets secret (use environment variables)
  • Handle errors gracefully (your users will thank you)
  • Log judiciously (but don't log sensitive info)

Testing the Integration

Before you pop the champagne, let's make sure everything's working:

  1. Set up a test environment (maybe use ngrok for local testing)
  2. Run through the auth flow
  3. Try making some API calls

If everything's working, give yourself a pat on the back!

Conclusion

And there you have it, folks! You've just built a secure, user-friendly auth flow for your Delighted integration. Pretty cool, huh?

Remember, this is just the beginning. From here, you can expand your integration to do all sorts of nifty things with Delighted's API. The sky's the limit!

Now go forth and delight your users with your awesome new integration. You've got this! 🚀