nothus

A l’occasion de l’édition de mon nouveau module de gestion RSS (seulement) pour Firefox (pour l’instant) grâce aux possibilités des Web Extension, je me suis retrouvé confronté à un besoin : comment extraire le contenu d’une page HTML dont la profusion et la diversité du net, a le secret ?

(nb : j'ai publié mon code source sur gitHub pour ceux qui sont intéressés et le mot-clé sur Twitter est #NothusVeille)

Ce besoin est un impératif pour produire un bouton « lire un résumé de la page » pour chaque item des flux récupérés. Ou, pour ceux qui l’utilisent déjà, la fonction « lecture » de votre navigateur libre préféré, celui à tête de renard…

Bref ne garder que la partie visible et intéressante d’un document HTML tel que l’utilisateur voudrait l’avoir. Et si possible en moins d’une centaine de lignes, car l’objectif n’est pas de produire un énième usine à gaz : tant pis si l’outil n’est pas totalement efficace, s’il l’est déjà sur la majorité des sites. Certes il existe déjà des services web qui le font : cependant mon objectif est d’avoir 0 traceur pour l’utilisateur du module et pas de dépendance à un service sinon au module lui-même.

Un bon développeur web dira que c’est assez facile : un élément du DOM dispose de l’attribut en lecture seul « innerText » qui retourne le texte réellement affiché à l’écran. Oui mais : comment savoir dans l’arbre quel nœud ou élément, et bien évidemment quel élément parent car le contenu pertinent est rarement dans un seul, qui puisse nous intéresser ? Le poids / l’intérêt / la répétition des liens, l’aspect général de la page sont autant d’indices… pour un humain. Pour un script, rien ne ressemble plus à un nœud qu’un autre nœud, et un élément à un élément.

Et le web est, une fois encore, une jungle, qui change rapidement. Cependant quelques fondamentaux demeurent.

Désespéré (instant dramatique!), il m’a fallu le repas de Noël pour trouver la solution : l’oie rôtie est toujours de bon conseil. Résumé.

Procédure :
1. Il faut déterminer les éléments qui sont les plus susceptibles de contenir du texte intéressant.
2. Il faut les récupérer et vérifier s’ils existent dans la page.
3. Il faut trier par ordre d’importance et renvoyer le tout par catégorie d'éléments (il y a donc une priorité principale puis secondaire).

Variables principales :
- un tableau de tableaux de la manière de déterminer si le contenu doit être gardé, comme la place dans les « priorités » (le chiffre le plus bas est le plus pertinent : l’index numérique du tableau sert de référence) ;
- un objet de « déterminants » les plus probables : comment et quoi récupérer.

Question subsidiaire : comment sont trouvés les déterminants ? Par l’expérience et une recherche rapide des attributs les plus utilisés pour gérer l’affichage d’une page web dans l’espace francophone.

En Javascript, cela nous donne :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
function ExtraireContenuPertinent() { 
	var priorites = [ 
		[ 
			"getElementsByTagName",
			(element) => { return (element.length>0)?true:false; }
		],
		[ 
			"#id",
			(element) => { return (element!=null)?true:false; }
		],
		[ 
			"getElementsByClassName",
			(element) => { return (element.length>0)?true:false; }
		] 
	]; 
	var determinants = {
		"getElementsByTagName": ["article", "content"], 
		"#id": ["page", "blog", "story", "content", "page-root", "page_root"], 
		"getElementsByClassName": ["story", "blog", "article", "content", "contenu", "content", "page_content", "page_article", "page_root", "post"] 
	}
	var r = {}; 
	for(var fct in determinants) { 
		items = determinants[fct]; 
		r[fct] = items.map( 
			(el_cherche, index, els_cherche) => { 
				if (fct!="#id") { 
					return document.body[fct](el_cherche); 
				} else { 
					return document.getElementById(el_cherche); 
				} 
			} 
		); 
	} 
	for (var i=0; i<priorites.length; i++) { 
		var _r = r[priorites[i][0]].filter( 
			priorites[i][1] 
		); 
		if (_r.length>0) 
			return [priorites[i][0], _r]; 
	} 
	return false; 
}; 
 
var elC = ExtraireContenuPertinent(); 
if (elC!=false) 
	console.log( 
		elC
	);

Ce code, exécuté dans une page, renverra la liste des éléments trouvés les plus pertinents (pas tous!).

Ainsi ce script exécuté sur cette page, dispose d'un rendu conforme à ce qui est attendu - même s’il reste quelques portions incongrues -, au travers d’un collection HTML dont le premier élément est la balise article :

COMPTE RENDU

Au Liberia, George Weah favori du second tour de l’élection présidentielle

Le scrutin oppose l’ex-star du football, arrivée en tête au premier tour, au vice-président sortant, Joseph Boakai.

Le Monde.fr avec AFP Le 26.12.2017 à 09h44 • Mis à jour le 26.12.2017 à 10h05

S'abonner dès 1 €
Réagir
Ajouter

Partager (86)
Tweeter

Au lendemain de festivités de Noël plus sobres que d’habitude, les Libériens votent, mardi 26 décembre, pour élire leur nouveau président lors d’un second tour qui oppose une légende du football, George Weah, au vice-président sortant, Joseph Boakai. (...)