{"id":174,"date":"2013-06-02T21:07:28","date_gmt":"2013-06-02T20:07:28","guid":{"rendered":"http:\/\/sphinx.lamecarlate.net\/?p=174"},"modified":"2018-09-30T18:01:39","modified_gmt":"2018-09-30T17:01:39","slug":"modifier-une-fonction-jquery-native-sans-lalterer","status":"publish","type":"post","link":"https:\/\/informatique.lamecarlate.net\/articles\/modifier-une-fonction-jquery-native-sans-lalterer","title":{"rendered":"Modifier une fonction jQuery native sans l’alt\u00e9rer"},"content":{"rendered":"

Derni\u00e8rement, je cherchais \u00e0 effectuer une action suppl\u00e9mentaire en cas de succ\u00e8s d’un appel Ajax : en effet, dans l’application que je d\u00e9veloppe, j’ai un contr\u00f4leur principal, par lequel passent toutes les requ\u00eates, et qui v\u00e9rifie si l’utilisateur est bien connect\u00e9 – dans le cas contraire, il le redirige vers la page de connexion. Mais dans le cas d’une page laiss\u00e9e \u00e0 l’abandon suffisamment longtemps pour que la session expire, et o\u00f9 l’utilisateur ne recharge pas, mais effectue une action qui appelle le serveur via XMLHttpRequest (Ajax, en gros), eh bien, la redirection ne se faisait pas comme je le voulais.<\/p>\n

En effet, les sp\u00e9cifications du W3C indiquent que si l’origine de la source et l’origine de l’URL demand\u00e9e sont la m\u00eame, alors le navigateur doit suivre silencieusement la redirection, tout en observant les r\u00e8gles d’\u00e9venements s’appliquant aux requ\u00eates de m\u00eame origine.<\/q> ((If the source origin and the origin of request URL are same origin transparently follow the redirect while observing the same-origin request event rules.<\/q> Source :\u00a0http:\/\/www.w3.org\/TR\/XMLHttpRequest\/#infrastructure-for-the-send-method<\/a> ))<\/p>\n

Par cons\u00e9quent, comme la fonction JavaScript ex\u00e9cut\u00e9e en retour de mon appel affichait des informations dans un \u00e9l\u00e9ment de la page, \u00e0 cause de la redirection, c’\u00e9tait la page de connexion qui se retrouvait dans cet \u00e9l\u00e9ment. Donc, il me fallait trouver un moyen de rediriger correctement. Et pour cela, j’ai fait ce que Paul Irish appelle du duck punching<\/a> ! L’id\u00e9e est tout simplement de red\u00e9finir une fonction de base pour qu’elle renvoie autre chose.<\/p>\n

Ici, je court-circuite la m\u00e9thode jQuery.ajax, en conservant l’ancienne m\u00e9thode dans une variable :<\/p>\n

var _old = $.ajax;\n<\/code><\/pre>\n

…et aussi l’objet (success) que je vais modifier :<\/p>\n

var _oSuccess = options.success; \/\/ on conserve la r\u00e9f\u00e9rence de base \u00e0 l'objet\n<\/code><\/pre>\n

…en pr\u00e9cisant que si je re\u00e7ois une r\u00e9ponse particuli\u00e8re :<\/p>\n

if(response.deconnexion_utilisateur == true)\n<\/code><\/pre>\n

…alors je fais une action particuli\u00e8re :<\/p>\n

location.href = response.url ;\nreturn false;\n<\/code><\/pre>\n

…sinon on r\u00e9injecte l’objet de base :<\/p>\n

_oSuccess(response); \/\/ on r\u00e9injecte l'objet\n<\/code><\/pre>\n

Dans tous les cas, on lance l’ancienne fonction, avec, peut-\u00eatre, les nouveaux arguments :<\/p>\n

return _old.call(this,options);\n<\/code><\/pre>\n

Ce qui nous donne au final :<\/p>\n

(function($){\n\n    var _old = $.ajax; \/\/ on conserve la r\u00e9f\u00e9rence de base \u00e0 la m\u00e9thode\n    $.ajax = function(options){\n        var _oSuccess = options.success; \/\/ on conserve la r\u00e9f\u00e9rence de base \u00e0 l'objet\n        options.success = function(response) {\n            if(response.deconnexion_utilisateur == true){\n                \/\/ on redirige vers la connexion\n                location.href = response.url ;\n                return false;\n            }\n            else {\n                _oSuccess(response); \/\/ on r\u00e9injecte l'objet\n            }\n        }\n        \/\/ on appelle l'ancienne m\u00e9thode avec les nouveaux arguments\n        return _old.call(this,options);\n    };\n\n})(jQuery);\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"

Derni\u00e8rement, je cherchais \u00e0 effectuer une action suppl\u00e9mentaire en cas de succ\u00e8s d’un appel Ajax : en effet, dans l’application que je d\u00e9veloppe, j’ai un contr\u00f4leur principal, par lequel passent […]<\/p>\n","protected":false},"author":1,"featured_media":208,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[35],"tags":[50,6,18],"_links":{"self":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/174"}],"collection":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/comments?post=174"}],"version-history":[{"count":1,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/174\/revisions"}],"predecessor-version":[{"id":931,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/174\/revisions\/931"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/media\/208"}],"wp:attachment":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/media?parent=174"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/categories?post=174"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/tags?post=174"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}