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

Sep 14, 2024 • 8 minute read

Hey there, fellow JavaScript enthusiast! Ready to dive into the world of Lodgify integrations? Today, we're going to walk through building a rock-solid authorization flow for your user-facing integration. Buckle up, because we're about to make your Lodgify integration dreams come true!

Introduction

Lodgify is a powerful vacation rental software, and integrating with it can open up a world of possibilities for your app. But before we can start playing with property data and bookings, we need to tackle the all-important authorization flow. Don't worry, though – I've got your back!

Prerequisites

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

Lodgify API credentials (if you don't have these yet, head over to the Lodgify developer portal)
A Node.js environment set up with Express.js
A basic understanding of OAuth 2.0 (but don't sweat it if you're a bit rusty)

Setting up the project

Let's get our project off the ground:

mkdir lodgify-integration
cd lodgify-integration
npm init -y
npm install express axios dotenv

Configuring environment variables

Create a .env file in your project root and add your Lodgify credentials:

LODGIFY_CLIENT_ID=your_client_id
LODGIFY_CLIENT_SECRET=your_client_secret
REDIRECT_URI=http://localhost:3000/callback

Implementing the authorization flow

Now for the fun part! Let's create a route to kick off our auth flow:

const express = require('express');
const axios = require('axios');
require('dotenv').config();

const app = express();

app.get('/auth', (req, res) => {
  const authUrl = `https://www.lodgify.com/oauth/authorize?client_id=${process.env.LODGIFY_CLIENT_ID}&redirect_uri=${encodeURIComponent(process.env.REDIRECT_URI)}&response_type=code`;
  res.redirect(authUrl);
});

app.listen(3000, () => console.log('Server running on port 3000'));

Handling the callback

When the user grants permission, Lodgify will redirect them back to your app. Let's set up a route to handle that:

app.get('/callback', async (req, res) => {
  const { code } = req.query;
  
  if (!code) {
    return res.status(400).send('Authorization code missing');
  }

  try {
    // We'll exchange the code for a token in the next step
    res.send('Authorization successful! Check the console for the access token.');
  } catch (error) {
    console.error('Error during token exchange:', error);
    res.status(500).send('An error occurred during authorization');
  }
});

Exchanging code for access token

Time to get that sweet, sweet access token:

const tokenResponse = await axios.post('https://www.lodgify.com/oauth/token', {
  grant_type: 'authorization_code',
  client_id: process.env.LODGIFY_CLIENT_ID,
  client_secret: process.env.LODGIFY_CLIENT_SECRET,
  code,
  redirect_uri: process.env.REDIRECT_URI
});

const { access_token, refresh_token } = tokenResponse.data;
console.log('Access Token:', access_token);
console.log('Refresh Token:', refresh_token);

Storing and managing tokens

In a real-world scenario, you'd want to securely store these tokens. For now, let's keep it simple and store them in memory:

let accessToken = null;
let refreshToken = null;

// Update the callback route to store the tokens
app.get('/callback', async (req, res) => {
  // ... previous code ...
  accessToken = tokenResponse.data.access_token;
  refreshToken = tokenResponse.data.refresh_token;
  // ... rest of the code ...
});

Making authenticated requests

Now that we have our access token, let's use it to make an API request:

app.get('/properties', async (req, res) => {
  try {
    const response = await axios.get('https://api.lodgify.com/v2/properties', {
      headers: { Authorization: `Bearer ${accessToken}` }
    });
    res.json(response.data);
  } catch (error) {
    console.error('Error fetching properties:', error);
    res.status(500).send('An error occurred while fetching properties');
  }
});

Error handling and edge cases

Remember to handle token expiration and refresh:

async function refreshAccessToken() {
  try {
    const response = await axios.post('https://www.lodgify.com/oauth/token', {
      grant_type: 'refresh_token',
      client_id: process.env.LODGIFY_CLIENT_ID,
      client_secret: process.env.LODGIFY_CLIENT_SECRET,
      refresh_token: refreshToken
    });
    accessToken = response.data.access_token;
    console.log('Access token refreshed successfully');
  } catch (error) {
    console.error('Error refreshing access token:', error);
  }
}

Testing the integration

Fire up your server and navigate to http://localhost:3000/auth in your browser. Follow the prompts, and you should see the access token logged in your console. Then, try hitting the /properties endpoint to see if you can fetch data from Lodgify.

Conclusion

And there you have it! You've just built a solid foundation for your Lodgify integration. From here, you can expand on this base to add more features and endpoints specific to your app's needs.

Remember, this is just the beginning. As you continue to develop your integration, always keep security in mind and consider implementing more robust error handling and token management.

Additional resources

Now go forth and build amazing things with Lodgify! You've got this! 🚀