11528 sujets

JavaScript, DOM et API Web HTML5

Modérateur
Bonjour à tous,

Je réalise actuellement un travail d'intégration pour lequel je dois récupérer des éléments provenant de la timeline Facebook de mon client. J'avais l'habitude de faire ça en utilisant une technique vieille comme le monde (mais pas forcément la meilleure, puisque dépendant de la structure HTML du document visé) : le scrapping. Pour Facebook, ce n'est pas possible, puisque tout est généré dynamiquement (react.js). Il me faut donc utiliser leur API, en l'occurrence, si je ne m'abuse, l'API Graph ). Dans la documentation sur cette API je pense qu'il faudra que j'utilise cette url de requête (je vais lancer une requête get en utilisant jQuery à partir de la page sur laquelle je souhaite insérer les données), il me faut donc l'id du client (pas de souci pour ça), mais également un token (jeton) d'accès utilisateur pour pouvoir accéder aux données de mon client.
Mes questions : suis-je bon ou faut-il faire attention à d'autres points ? Comment je fais pour demander à mon client un token ?
Merci d'avance Smiley smile
Modérateur
Bon j'avance un peu. j'ai dû créer un compte facebook à mon nom pour tester cela... J'ai créé une app que j'ai laissée en développement, ensuite je suis allé sur l'interface "explorer" de l'API pour obtenir un jeton utilisateur en ayant paramétré les autorisations de pages (user_posts et publish_pages). Ensuite, j'ai fait une requête get dans mon navigateur :
https://graph.facebook.com/{mon_id}/feed?access_token={le_fameux_jeton_acces_utilisateur}

J'obtiens ce json :
{
  "data": [
    {
      "message": "Vous connaissez Dirty Loops ? Des suédois (successeurs d'ABBA ?) qui mélangent jazz et pop dans leur compositions. J'adore ! Ils font des \"cover\" de certaines chansons vraiment bien réussis (en tout cas à mon goût).",
      "created_time": "2020-01-19T15:31:27+0000",
      "id": "**********************************"
    },
    {
      "message": "Le nouvel album de Madeon. Ecoutez-le, il est chouette !",
      "created_time": "2020-01-19T15:25:45+0000",
      "id": "************************************"
    },
    {
      "message": "Vous connaissez Snarky Puppy ? groupe Jazz / fusion ouvert à toute expérience. Voyez plutôt...",
      "created_time": "2020-01-19T10:59:15+0000",
      "id": "*************************************"
    },
    {
      "message": "Nouvel album Madeon. Allez l'écouter...",
      "created_time": "2020-01-19T10:57:29+0000",
      "id": "***************************************"
    },
    {
      "message": "Ma philosophie de la vie...",
      "created_time": "2020-01-19T10:52:03+0000",
      "id": "****************************************"
    },
    {
      "message": "Une revisite du tube de Mickael Jackson vraiment réussie. Pour ceux qui aiment un peu le jazz / fusion...",
      "created_time": "2020-01-19T10:49:17+0000",
      "id": "*******************************************"
    }
  ],
  "paging": {
    "previous": "https://graph.facebook.com/v5.0/114955016709018/feed?format=json&since=1579447887&access_token=****************************&limit=25&__paging_token=enc_AdBPxhqmDhF6wHeqVk8y2wyZAZAqMy1biqFhLI49EtD3N3CPxPRcpvRxCeQIT6qP0PO1JfMp0UMVXk3rY6fAzKqnRSCrIKBxvlGfKsxTZA4zaiEMgZDZD&__previous=1",
    "next": "https://graph.facebook.com/v5.0/114955016709018/feed?format=json&access_token=**************************************************&limit=25&until=1579430957&__paging_token=enc_AdDmZC0yF6qPCKyXaS2EnZCTeZAZAQ1zxSfjRZBRC2sLV1sstlXuS9qqoLQYpl5wfRHpjssFcoS5JexrT2tKc9hZC6H99SWZCEVqh5gc3M5Fjb3rruKXgZDZD"
  }
}


Franchement, je me vois mal demander tout ça au client !!!
Administrateur
Bonjour,

aucune idée de la meilleure manière de réaliser cela mais sur le point du scapping, tu peux utiliser Puppeteer ou équivalent "headless Chrome". C'est un Chromium (*) piloté par tes scripts, il interprétera sans problème une page en React.
Bon par contre gérer les cookies, la demande, les retours… J'espère qu'il y a des scripts ou tuto pour ça Smiley cligne

(*) les 300 Mo téléchargés par npm m'en ont convaincu Smiley smile Découvert via backstop.js qui prend et compare des captures d'écran via Puppeteer
Modérateur
Bonsoir Felipe.

Merci pour cette suggestion (je ne connaissais pas Puppeteer), mais c'est à mon avis utiliser l'artillerie lourde pour un cas qui devrait pouvoir se résoudre plus simplement. Je pense proposer à mon client de me fournir ses codes d'accès à Facebook afin de créer moi-même l'appli et la paramétrer...
Modifié par jojaba (21 Jan 2020 - 17:38)
Modérateur
Bonjour,

Tout arrive à qui sait être patient !
Je viens de découvrir un outil développé par Sebsauvage (à partir de 2013) et qui permet de "ressusciter" les flux rss (disparus depuis un certain temps) de Facebook, Twitter et autres réseaux sociaux. Le nom de cette application : RSS-BRIDGE. Comme son nom l'indique, elle permet de créer des ponts afin de "construire" notamment des flux RSS mais également récupérer les données au format json. Elle est open-source et apparemment bien maintenue. Je l'ai utilisée pour résoudre mon problème de récupération de fil Facebook et ça fonctionne très bien ! Plus besoin de cette fichue api proposée par FB !
En espérant que cela puisse être utile à d'autres...

Les liens utiles :
GitHub RSS-BRIDGE
Documentation RSS-BRIDGE

PS : je me demande s'il ne serait pas intéressant de proposer un article sur Alsacreations à propos de cet outil... Smiley cligne Si j'ai le temps et si ça intéresse quelqu'un, je m'y colle...