Instagram Issues

[iuscare]

Describe the bug

I've noticed that we are unable to retrieve the width or height of Instagram Videos/Images. A dump shows:

      -_events: []
      -_eventWildcards: []
      -_behaviors: []
      -_errors: null
      -_validators: null
      -_scenario: "default"
      +id: null
      +title: null
      +type: "image"
      +url: "https://scontent-fra3-1.cdninstagram.com/v/t51.29350-15/469535103_1983700908775813_1160600726627885406_n.webp?stp=dst-jpg_tt6&_nc_cat=101&ccb=1-7&_nc_sid=18de74 ▶"
      +width: null
      +height: null

Additionally, the data attachments object lacks width and height properties. Furthermore, I've observed that the author object contains mostly null values, even when the post in question comes from a public Instagram profile and is tagged with a tracked tag:

      +author: verbb\socialfeeds\models\PostAuthor {#6505 ▼
    -_events: []
    -_eventWildcards: []
    -_behaviors: []
    -_errors: null
    -_validators: null
    -_scenario: "default"
    +id: null
    +username: null
    +name: null
    +url: null
    +photo: null
  }

Steps to reproduce

Craft CMS version

Craft Pro 5.5.0

Plugin version

2.0.3

Multi-site?

No response

Additional context

No response

[engram-design]

I don't believe we have access via their API to get dimensions. See docs. The author things are coming through for me as well.

What's your Source Type?

[iuscare]

Hi Verbb,

Thank you for your quick response. Depending on the source type and provider, the media (videos) in iframes have different dimensions (Facebook Shorts, Instagram Reels, Facebook Videos, Instagram Posts). This means I can't set a fixed aspect ratio for the iframes, as this would result in only seeing partial content in the previews, and sometimes the video play button isn't even visible anymore. Do you have any ideas for an elegant solution, possibly using CSS?

Regarding the author object: it appears to be empty only for Instagram Posts/Reels from other accounts that use a hashtag we're tracking in their posts. These profiles are public though. Below is the complete post object of an affected entry.

verbb\socialfeeds\models\Post {#6756 ▼
  -_events: []
  -_eventWildcards: []
  -_behaviors: []
  -_errors: null
  -_validators: null
  -_scenario: "default"
  +id: "17866908333267321"
  +uid: null
  +title: null
  +text: """
    📣 DIE ZAHLEN DES WOCHENENDES 
    .
    Mächtig was los, 8 Spiele, oh là là. Alles dabei, wie in einer guten Plätzchentüte. Leckeres, Knackiges und ... nun ja ... Marzipan. 😬😅
    .
    Wir freuen uns über perfekte Herren und weiterhin siegreiche Damen. Und der Rest gewinnt beim nächsten Mal. So. 🎅🏻
    .
    #tgkonzvolleyball #tgkonz #matchday #spielergebnisse #hookahey #vereinsliebe #vereinssport #volleyballverein
    """
  +url: "https://www.instagram.com/p/DDWtfuzsfCP/"
  +sourceId: 5
  +sourceHandle: "instagram"
  +sourceType: "instagram"
  +postType: "carousel_album"
  +likes: null
  +shares: null
  +replies: null
  +dateCreated: DateTime @1733741383 {#6855 ▼
    date: 2024-12-09 10:49:43.0 +00:00
  }
  +dateUpdated: null
  +author: verbb\socialfeeds\models\PostAuthor {#6778 ▼
    -_events: []
    -_eventWildcards: []
    -_behaviors: []
    -_errors: null
    -_validators: null
    -_scenario: "default"
    +id: null
    +username: null
    +name: null
    +url: null
    +photo: null
  }
  +tags: []
  +links: []
  +images: array:8 [▶]
  +videos: []
  +data: array:9 [▼
    "caption" => """
      📣 DIE ZAHLEN DES WOCHENENDES 
      .
      Mächtig was los, 8 Spiele, oh là là. Alles dabei, wie in einer guten Plätzchentüte. Leckeres, Knackiges und ... nun ja ... Marzipan. 😬😅
      .
      Wir freuen uns über perfekte Herren und weiterhin siegreiche Damen. Und der Rest gewinnt beim nächsten Mal. So. 🎅🏻
      .
      #tgkonzvolleyball #tgkonz #matchday #spielergebnisse #hookahey #vereinsliebe #vereinssport #volleyballverein
      """
    "children" => array:1 [▼
      "data" => array:8 [▼
        0 => array:3 [▼
          "media_url" => "https://scontent-fra3-1.cdninstagram.com/v/t51.29350-15/469720235_3534003566900709_7962575624332547517_n.webp?stp=dst-jpg_tt6&_nc_cat=101&ccb=1-7&_nc_sid=18de74 ▶"
          "id" => "18308565871200287"
          "media_type" => "IMAGE"
        ]
        1 => array:3 [▶]
        2 => array:3 [▶]
        3 => array:3 [▶]
        4 => array:3 [▶]
        5 => array:3 [▶]
        6 => array:3 [▶]
        7 => array:3 [▶]
      ]
    ]
    "comments_count" => 0
    "id" => "17866908333267321"
    "like_count" => 38
    "media_type" => "CAROUSEL_ALBUM"
    "media_url" => "https://scontent-fra3-1.cdninstagram.com/v/t51.29350-15/469720235_3534003566900709_7962575624332547517_n.webp?stp=dst-jpg_tt6&_nc_cat=101&ccb=1-7&_nc_sid=18de74 ▶"
    "permalink" => "https://www.instagram.com/p/DDWtfuzsfCP/"
    "timestamp" => "2024-12-09T10:49:43+0000"
  ]
  +meta: null
}

[engram-design]

I typically use a responsive aspect ratio helper, which I agree isn't 100% foolproof, but does deal with most cases.

The reason I asked about the Source Type, is I was thinking it could be related to that, as there is specific handling for each type of content you want to pull through.

Looks like the API endpoints recent_media doesn't support owner which would require us to do an additional fetch to get that user information.

For Profile Posts though, that's certainly working for me.