Using Youtube Data v3 API

Developer Support CMS Development
, ,
1

Hi,

I am working on the page that helps me pull all the videos from a youtube channel. The aim is t auto populate the vidoes instead of myself updating/uploading new videos in the site.

What is the best way to acheive this? I planned to use youtube data v3 api. But How can this be done in hubspot cms?

2

Hey @fah08

I’ll tag a few of our experts to see if they have been using this integration.

Hey @piersg @Anton @albertsg could you please share your thoughts with @fah08?

thanks & happy Friday!

Sharon

3

Hi @fah08.

You can embed a playlist of a YouTube user’s videos very easily (it will display all in one video frame):

<iframe src="http://www.youtube.com/embed/?listType=user_uploads&list=[CHANNEL_NAME]" width="480" height="400"></iframe>

The YouTube iFrame API will be more useful if you go down this route: https://developers.google.com/youtube/iframe_api_reference

If you want to do anything more complicated than that using the YouTube API, you can make an AJAX call in Javascript to the API. Something like:

$.ajax({
 url: "https://www.googleapis.com/youtube/v3/playlists",
 type: 'GET',
 dataType: 'json',
 data: {
 part : 'snippet', 
 channelId: [CHANNEL ID],
 maxResults : 50,
 key: '[API KEY]', 
 },
 success: function(data) {
 // do things with the result
 },
 error: function(xhr, status, error) {
 // handle any errors e.g.  console.log(xhr.responseText);
 }
});

However, this will expose your API key to the public (and OAuth 2.0 client ID if you use that), unless you proxy the requests from your frontend JS through a separate server that can process the request and then make an authenticated request to YouTube.

Another option I think would work is to make your own Hubspot app which would allow you to hide your credentials (documentation here).

There is a Hubspot-made YouTube app in the App Marketplace, but I’m not sure you can pull videos using it, I think it’s for pulling analytics data from YouTube but worth checking.