CODEWITHSUNDEEP
javascriptinstagraminstagram-apiinstagram-graph-api
Michael Giovanni Pumo
Michael Giovanni Pumo

Reputation: 14774

How to return video from an Instagram media carousel album?

I am making requests to the Instagram API to get posts on a users feed.

https://developers.facebook.com/docs/instagram-api/reference/media/#returnable-fields

There appear to be 3 types coming through; IMAGE, VIDEO and CAROUSEL_ALBUM.

In the IMAGE type, the media_url key in the object is a link to the image.

In the VIDEO type, the media_url key in the object is a link to the mp4 video and it has an additional key called thumbnail_url for the static image of the video.

The CAROUSEL_ALBUM however only has a media_url key (like IMAGE) and it is only an image, even if I know that carousel contains mp4 videos.

How can I get the video on the CAROUSEL_ALBUM type that's returned from Instagram?

I request the following fields:

`https://graph.facebook.com/v3.3/${item.id}?access_token=${accessToken}&fields=id,media_type,media_url,thumbnail_url,permalink,caption,timestamp`

These requests are made in a loop from an array of post ID's. Are there additional settings I need to make?

A typical CAROUSEL_ALBUM request I get looks like:

{
  "media_type": "CAROUSEL_ALBUM",
  "media_url": "https://scontent.xx.fbcdn.net/v/t51.2885-15/66441408_2082905628680299_8050667243209299756_n.jpg?_nc_cat=100&_nc_oc=AQk2PElxoGzOzQ_4f-4vANh_Db1Mmra2wkci2aEKbc3vCstLzQeWQxKadbe1ByF8Vec&_nc_ht=scontent.xx&oh=5aa8ac107e1bd5da07b6cb5d760200f6&oe=5DC18C62",
  "permalink": "https://www.instagram.com/p/Bzif-HhAiBk/",
  "caption": "Each video in this carousel stands for a stage in the animation process for our latest experiment, where we animated a 3d model and used it as a basis for the 2d rotoscoping.",
  "timestamp": "2019-07-05T14:50:53+0000",
  "id": "18053365636184706"
}

Thanks

Upvotes: 1

Views: 2846

Answers (1)

Michael Giovanni Pumo
Michael Giovanni Pumo

Reputation: 14774

Whilst it doesn't seem like this API returns a video at the top-level for a carousel type, I did find a work-around for anyone that may need it.

In a carousel type, there should be a key for children. So you need to request that in the field's parameters.

Using sub-fields in this children field, you can get the actual media items (videos).

For example:

const fields = [
  'caption',
  'children{media_type,media_url,thumbnail_url}',
  'id',
  'media_type',
  'media_url',
  'permalink',
  'thumbnail_url',
  'timestamp'
].join(',')

const request = await fetch(`https://graph.facebook.com/v3.3/${userId}/media?fields=${fields}&access_token=${accessToken}`)

In the children's key of the JSON response, you will see your videos. Simply use this to display as your main media if you so wish.

Try the Graph API Explorer to see what fields are available to you. I cannot work out how to return width and height though if anyone is aware how to do that.

https://developers.facebook.com/tools/explorer

Upvotes: 9

Related Questions