How to Subscribe to and Receive Push Notifications from YouTube’s API using Typescript and Nodejs
Tags: typescript, webdev, programming, tutorial
Published: 2021-11-08 16:25:11

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.

```javascript
"dev": "tsc",
"start": "ts-node index"
```

###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``.

```javascript
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);
});
```

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](https://pubsubhubbub.appspot.com/subscribe). 

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](https://github.com/AlgoDame/Youtube-PubSubHubBub-Notification-Application) for this article. You are welcome to fork and star the repo.

Thank you for reading.