Manuel:Ajax

Ajax est le terme employé pour JavaScript quand il sert à charger des parties de page à la demande. Ainsi, pour utiliser Ajax dans MédiaWiki, il est recommandé d'utiliser jQuery.ajax() (ou le module JavaScript mediawiki.api). On fera ainsi une requête à l' API MediaWiki sur Ajax.

Détails

Demandes asynchrones

Une requête dite asynchrone envoie ses données vers le serveur, puis continue son exécution. Quelques temps après, le serveur peut renvoyer une réponse (selon le type de la requête qu'il a reçue), auquel cas celle-ci sera transmise à une fonction JavaScript pour être traitée. Une autre fonction peut être fournie pour gérer les cas où la requête échoue pour une raison quelconque. Vous trouverez ci-dessous un exemple d'appel à l'API de connexion avec l'envoi du nom d'utilisateur et du mot de passe.

mw.loader.using( 'mediawiki.api', function () {
	( new mw.Api() ).get( {
		action: 'query',
		lgname: 'foo',
		lgpassword: 'foobar'
	} ).done( function ( data ) {
		alert( data );
	} );
} );

Alternativement vous pouvez utiliser les fonctions jQuery directement :

$.ajax({
        // request type ( GET or POST )
	type: "GET",
        
        // the URL to which the request is sent
	url: mw.util.wikiScript('api'),
        
        // data to be sent to the server
	data: { action:'query', format:'json', lgname:'foo', lgpassword:'foobar' },
        
        // The type of data that you're expecting back from the server
	dataType: 'json',
        
        // Function to be called if the request succeeds
	success: function( jsondata ){
		alert( jsondata.result );
	}
});

La fonction « mw.util.wikiScript » n'est disponible que depuis la version 1.18 .

Requêtes synchronisées

L'autre type de requête (les requêtes synchrones) consiste à envoyer des données au serveur et à attendre la réponse. Cela signifie que JavaScript restera bloqué le temps que le serveur renvoie des données, ou que la requête échoue pour quelque raison. L'exemple suivant récupère la liste des modèles de « Pages liées » :

whatLinksHere = JSON.parse(
    $.ajax({
        url:mw.util.wikiScript('api'),
        data: { action: 'query', format: 'json', list: 'embeddedin', eititle: 'Template:' + templateName, eilimit: 500 },
        async: false
    })
    .responseText
);

// ... usage ...
for (i=0; i<whatLinksHere.query.embeddedin.length; i+=1) {
    alert(whatLinksHere.query.embeddedin[i]);
}

(JSON.parse() est une fonction standard JavaScript qui renvoie un objet à partir de sa représentation sous forme de chaîne en format JSON).

Limitations

A cause de la règle sur la même origine, il est difficile pour un script qui se trouve sur un site extérieur, de récupérer les données d'un wiki qui n'est pas hébergé sur le même domaine — par exemple, on ne peut pas directement récupérer les données de https://en.wikipedia.org/wiki/ pour http://example.org/wiki/. Les navigateurs les plus récents prennent en charge une instruction explicite pour permettre cet accès via le partage des ressources entre différentes origines mais ceci ne fonctionnera qu'avec des serveurs configurés pour générer les entêtes appropriés, que le navigateur récent de l'utilisateur devra reconnaître. Les développeurs qui ont des problèmes avec les anciens navigateurs ne peuvent pas encore utiliser CORS.

Il est possible de contourner la règle de la même origine en utilisant JSONP au lieu du JSON brut qui fonctionnera sur les navigateurs plus anciens (y compris Internet Explorer 6).

$.ajax({
    url: '//www.mediawiki.org/w/api.php?format=jsonty&action=query&meta=siteinfo&siprop=general&callback=?',
    data: {
        format: 'json'
    },
    dataType: 'jsonp'
}).done( function ( data ) {
    ...
} );

Voir aussi

• Catégorie:Extensions Ajax - Extensions utilisant l'interface Ajax de MediaWiki.

Liens externes

• mediawiki.api (module JavaScript)
• jQuery.ajax (méthode jQuery)

Informations générales à propos de XMLHttpRequest :

• Spécifications de XMLHttpRequest sur W3.org
• XMLHttpRequest sur Wikipedia
• XMLHttpRequest sur MDN