Intégrer un feed Instagram sur un site web sans utiliser l'API

Développement web
20 avril 2017
Intégrer un feed Instagram sur un site web sans utiliser l'API

En date du 28 novembre 2017, le point d'accès public /media/ d'Instagram n'est plus accessible, alors cette méthode ne fonctionne plus.

 

Lorsque je développais ce site, je savais que je voulais implémenter un feed Instagram mais je ne voulais pas avoir à intégrer l'API d'Instagram pour un élément aussi peu important. J'ai donc fait quelques recherches sur le sujet et j'ai fini par trouver une solution super simple qui correspondait très bien à mes besoins.

https://www.instagram.com/emilewiscarroll/media/

L'URL ci-dessus sur le site web d'Instagram permet d'obtenir toutes les informations d'un profil Instagram en format JSON: les posts récents avec les images (disponibles en plusieurs résolutions), la légende (ou le texte), les likes et les commentaires, des informations sur l'utilisateur en tant que tel, et quelques autres éléments qui sont superflus dans notre cas. Il est donc possible, en récupérant les informations disponibles sur cette page, de générer un feed Instagram dans à peu près n'importe quel langage de programmation, et sans avoir à passer par l'API et à s'authentifier. De plus, étant donné que nous générons nous même le feed, il est possible de le monter exactement comme on le veut. 

Voici un exemple très simple d'une implémentation du feed en PHP:

<?php
$username = 'emilewiscarroll';
$json = file_get_contents('https://www.instagram.com/'.$username.'/media/');
$instagram_feed_data = json_decode($json, true);

if (isset($instagram_feed_data['items'])) {
    foreach ($instagram_feed_data['items'] as $item) {
        $link = $item['link'];
        $img_url = $item['images']['low_resolution']['url'];
        $caption = isset($item['caption']) ? $item['caption']['text'] : '';
        
        ?>
        <a href="<?= $link; ?>" target="_blank" class="instagram-post">
            <img src="<?= $img_url; ?>">
            <div class="caption"><?= $caption; ?></div>
        </a>
        <?php
    }
}
?>
Vous pouvez également voir comment je l'ai moi-même intégré sur mon site web en vous rendant sur la page À propos de mon site. 
 
Évidemment, ce n'est pas le fonctionnement officiel recommandé par Instagram; il est possible que l'accès à cet page soit restraint dans le futur, mais d'ici là, ça reste la manière la plus simple et rapide d'obtenir de l'information sur un profil Instagram.
 
J'espère que ça l'a pu vous aider! Si vous décidez d'intégrer un feed Instagram de cette manière, envoyez moi un lien vers celui-ci, j'aimerais bien voir le résultat.
 
PS: J'ai également fait un tutoriel vidéo sur le sujet, disponible ci-dessous:
 

S'abonner à l'infolettre

Recevez à chaque mois un résumé de l'activité sur mon site ainsi que des offres exclusives et des annonces officielles en vous abonnant à l'infolettre.