DEV Community

Cover image for How to Subscribe to and Receive Push Notifications from YouTube’s API using Typescript and Nodejs
Chiamaka Ojiyi
Chiamaka Ojiyi

Posted on

How to Subscribe to and Receive Push Notifications from YouTube’s API using Typescript and Nodejs

Youtube’s API provides developers with a way to get push notifications for when specific changes occur on a youtube channel. Youtube’s API sends out these notifications through a PubSubHubbub webhook protocol.

Webhooks are used to send near-real-time data to applications.

Let’s say you have an application that sends out emails to a mailing list and you only want to send out these emails whenever Beyonce posts a video on her channel. To do this, you can use Youtube’s webhooks to subscribe to push notifications on Beyonce’s channel. Whenever Beyonce posts a video, Youtube will tunnel down a request to your server to inform you of this event.

In order to get the push notifications from Youtube’s webhook, you need to provide Youtube with a URL which you will use to receive the data for whenever a new video is uploaded on a specific channel. This URL is called a webhook call-back URL.

Youtube only sends out push notifications for the following events on a channel:

  • New video is uploaded
  • A video’s title is updated
  • A video’s description is updated

Youtube sends out the push notifications to your call-back URL in xml format.

In this tutorial, I’ll show you how you can set up a call-back server to subscribe to and receive push notifications from Youtube’s API using typescript and nodejs.

Project set up

In your project folder, run npm init -y in your terminal to create a package.json file

Run npx tsc --init to create a tsc file. This is a typescript configuration file.

In the script section of your package.json, add this bit of code for running the application.

"dev": "tsc",
"start": "ts-node index"
Enter fullscreen mode Exit fullscreen mode

Install dependencies

Run npm i @types/express, dotenv, express, ts-node, typescript, youtube-notification to install dependencies.

Let's code the application

Create a file and name it index.ts.

import express from 'express';
import dotenv from "dotenv";
dotenv.config();

const YouTubeNotifier = require('youtube-notification');
const app = express();
const port = 6050;
const baseUrl = "https://strong-yak-75.loca.lt"
let channelId = process.env.CHANNEL_ID;

export const notifier = new YouTubeNotifier({
    hubCallback: `${baseUrl}/youtube/notifications`,
});

app.use("/youtube/notifications", notifier.listener());

app.listen(port, () => {
    console.log(`App listening at http://localhost:${port}`)

})

notifier.subscribe(channelId);

notifier.on('subscribe', data => {
    console.log('Subscribed');
    console.log(data);
});

notifier.on('notified', data => {
    console.log('New Video');
    console.log(data);
});
Enter fullscreen mode Exit fullscreen mode

Create a .env file in the root of your project and add your youtube channel ID there.

Add the channel ID in this format:
CHANNEL_ID="YOUR_CHANNEL_ID_GOES_HERE"

To get the channel ID of a youtube channel, navigate to the channel on youtube. The browser address bar should have a URL in the format below.

https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ

This UC8butISFwT-Wl7EV0hUK0BQ part is the channel ID.

To get the notifications from Youtube, your application will need to be deployed in order to have a https forwarding URL. Since we are still developing locally, we'll use a secondary service called Localtunnel.

Locatunnel allows us to easily share a web service on our local development machine with the world.

To start your server, go to your terminal and run:
npm start

While your server is running, open another terminal window and run:

npx localtunnel --port "ADD_YOUR_PORT_NUMBER_HERE"

A https URL will be printed on your terminal. Copy the URL and add it as the baseUrl in your index file. Do not close the terminal running localtunnel.

Restart your server to reflect the edit you just made. You should have two terminals up.

Now whenever a new video is uploaded to the specific youtube channel, the details of the video will be logged to the terminal where your serve is currently running on.

Some helpful debugging tips

You may need to diagnose your subscription to be sure you are subscribed or if errors occur when Youtube tries to send you push notifications.

To run this diagnosis, navigate to the PubSubHubBub page.

Go to the Subscriber Diagnostics section of the page. Add your call-back URL and the topic URL.

Topic URL:

https://www.youtube.com/xml/feeds/videos.xml?channel_id=YOUR_CHANNEL_ID

Click "Get Info" to run the diagnosis.

Finally, here's the Github repo for this article. You are welcome to fork and star the repo.

Thank you for reading.

Top comments (7)

Collapse
 
navonf profile image
Navon Francis

why did we need both ts-node and typescript modules?

Collapse
 
algodame profile image
Chiamaka Ojiyi

Hello Navon, I used ts-node because I am running my typescript file directly, not the compiled javascript. I am running index.ts, so I need ts-node for that. Thank you for reading and engaging with me. Hope you found this useful!

Collapse
 
ayuechuan profile image
ayuechuan

The blogger is Backend engineer,Get used to type coding

Collapse
 
algodame profile image
Chiamaka Ojiyi

Thank you for reading. Hope you found this useful.

Collapse
 
richeskelechi profile image
Riches

Nice one. Chiamaka. I actually learnt a lot from this.

Collapse
 
algodame profile image
Chiamaka Ojiyi

Thank you Riches. Glad you found it useful 🙂

Collapse
 
adedipupo profile image
Jokanola Benedict

I found this interesting and helpful.