Appels AJAX + #WPML ? : Attention à votre ajaxurl !

Appels AJAX + #WPML ? : Attention à votre ajaxurl !

Je vous fais un article type astuce/debug qui risque de vous faire gagner du temps si jamais vous tombez sur ce « bug » dira-t-on.

So, WPML et alors ?

Si vous utilisez le plugin WPML et que vous avez un fichier JavaScript dans vos développements qui utilise la variable native de WordPress ajaxurl pour un appel AJAX en GET, je vous mets en garde car je me suis fait avoir.

Petit rappel, la variableajaxurl contient l’URL relative vers la pageadmin-ajax.php de votre site, ce qui peut donner le plus souvent :/wp-admin/admin-ajax.php

Voici dans le code source d’une de vos page d’administration :

var ajaxurl = '/wp-admin/admin-ajax.php',
	pagenow = 'post',
	typenow = 'post',
	adminpage = 'post-new-php',
	thousandsSeparator = ' ',
	decimalPoint = ',',
	isRtl = 0;

Le code, avant.

Avant je faisais ça par exemple :

$.get( ajaxurl + "?action=mon_action + "&_ajax_nonce="+ $('#nonce').val() ).done( ... );

L’URL d’appel est alors /wp-admin/admin-ajax.php?action=mon_action&_ajax_nonce=ec42f3aa

What’s up Doc?

Vous me direz « oui, pareil, où est le soucis ? »

Et bien, tant qu’il n’y a pas WPML, il n’y a pas de soucis, mais notre cher et fameux plugin de traduction ajoute un hook sur admin_url pour y ajouter la langue en cours.

Et puisque WordPress imprime la variable ajaxurl en utilisant la fonction admin_url() et bien … sa valeur s’en retrouve modifiée.

Modifiée comment ? C’est grave ? Oui regardez un peu :

var ajaxurl = '/wp-admin/admin-ajax.php?lang=fr',
	pagenow = 'post',
	typenow = 'post',
	adminpage = 'post-new-php',
	thousandsSeparator = ' ',
	decimalPoint = ',',
	isRtl = 0;

Ouchie … en ajoutant son paramètre ?lang=fr ma concaténation va forcément poser un problème, si je reprends mon code du dessus pour mon appel AJAX, mon URL s’appel sera alors :

/wp-admin/admin-ajax.php?lang=fr?action=mon_action&_ajax_nonce=ec42f3aa

Le paramètre lang vaut alors fr?action=mon_action&_ajax_nonce=ec42f3aa et c’est le seul paramètre.

Mon action ne peut être réalisée, elle va donc se retrouver dans le néant, les abîmes, les … ok vous avez compris.

Réglons ça !

La faute à qui, je ne sais pas trop … J’hésite à dire qu’il ne faudrait pas modifier la valeur par défaut d’une variable native de WordPress, mais en même temps je comprends le besoin de faire ça.

Le but étant que les appels AJAX aient connaissance via un simple paramètre de la langue en cours, pourquoi pas.

Néanmoins, une fois dans le code AJAX, on peut aussi très bien connaitre la langue via le PHP donc …

Après je me dis que, j’ai mal concaténé mes valeurs, que j’aurais dû faire attention à l’existence ou non de paramètres sur cette URL, chose que je fais pour d’autres cas, mais pas sur une variable du core.

Bref, voyons comment régler ça, tout simplement.

var concat = ajaxurl.indexOf("?") > 0 ? "&" : "?";
$.get( ajaxurl + concat + "action=mon_action + "&_ajax_nonce="+ $('#nonce').val() ).done( ... );

Magie (ou pas), il suffit de vérifier si l’URL contient déjà un paramètre, c’est à dire si le caractère ? est présent ou non. S’il l’est alors on va utiliser & pour concaténer sinon on utilisera ?.

Pour ceux qui n’ont pas l’habitude de lire le test avec un « ? : « , il s’agit d’un test conditionnel ternaire.

L’URL d’appel est devenue /wp-admin/admin-ajax.php?lang=fr&action=mon_action&_ajax_nonce=ec42f3aa

Voilà, maintenant vos appels AJAX en GET en back-office avec WPML sont corrects !

 

Lire la suite

Vous aimez ? Partagez !

Abonnement gratuit à 0€


4 thoughts on “Appels AJAX + #WPML ? : Attention à votre ajaxurl !”

  • 1
    Merci pour ton article, du coup je me suis dit que j’allais vérifier si pollylan souffrait du même problème. Et je n’ai rien trouvé, la valeur de la variable n’est pas modifié en fonction de la langue. ;)
  • 2
    Clement on 2 août 2016 Répondre
    Une autre solution serait de passer les paramètres dans un objet et de laisser jQuery faire le boulot : http://pastebin.com/8YkCnvkv
    Il s’adaptera à l’url de base pour rajouter les paramètres supplémentaires
    • 3
      Julio Potier on 2 août 2016
      Excellente idée aussi, merci Clément !
  • 4
    Rahajason on 13 novembre 2016 Répondre
    Merci pour le tuyau,
    Une question :
    var concat = ajaxurl.indexOf(« ? ») > 0 ? « & » : « ? »; ne doit pas être
    var concat = ajaxurl.indexOf(« ? ») > -1 ? « & » : « ? »;

    ou je me trompe?

    Merci

Laisser un commentaire

Avant de parler, merci de lire la charte des commentaires.

Utiliser le tag [php][/php] pour ajouter du code ou utilisez un service comme pastebin.com.
Cibler un commentateur avec un "@", merci à Mention Comments Authors !