Using Youtube Data v3 API

SOLVE
Highlighted
New Contributor

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?

Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
Highlighted
Esteemed Contributor

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.

 

2 Replies 2
Community Manager

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



¿Sabías que la Comunidad está disponible en Español?
¡Participa hoy en conversaciones en el idioma de tu preferencia,cambiando el idioma en tus configuraciones!

Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !


Reply
0 Upvotes
Highlighted
Esteemed Contributor

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.