{"id":6489,"date":"2014-09-05T04:52:31","date_gmt":"2014-09-05T04:52:31","guid":{"rendered":"https:\/\/dev.railscarma.com\/how-to-use-rack-middleware-in-rails-for-auto-completion\/"},"modified":"2021-06-07T07:24:29","modified_gmt":"2021-06-07T07:24:29","slug":"comment-utiliser-le-middleware-rack-dans-les-rails-pour-la-completion-automatique","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/fr\/blog\/gestion\/comment-utiliser-le-middleware-rack-dans-les-rails-pour-la-completion-automatique\/","title":{"rendered":"Comment utiliser le middleware rack dans Rails pour la saisie semi-automatique\u00a0?"},"content":{"rendered":"
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Dans les applications Web modernes d'aujourd'hui, la saisie semi-automatique\/les suggestions automatiques sont tr\u00e8s courantes, qu'il s'agisse d'applications petites ou tr\u00e8s grandes, il est tr\u00e8s important de r\u00e9pondre simultan\u00e9ment \u00e0 plusieurs requ\u00eates avec une r\u00e9ponse rapide du serveur pour rendre l'exp\u00e9rience utilisateur meilleure et plus agr\u00e9able.<\/p>\n

C\u2019est ici qu\u2019intervient le middleware de rack.<\/strong><\/p>\n\n

Qu'est-ce que le middleware rackable ?<\/strong>?<\/h5>\n

En termes simples, un middleware Rack nous permet de faire des choses avant ou apr\u00e8s dans une application rack. Le middleware rack est initialis\u00e9 \u00e0 l\u2019aide d\u2019une application rack et doit r\u00e9pondre \u00e0 une m\u00e9thode d\u2019appel.<\/p>\n

Le middleware de rack peut en outre confier le contr\u00f4le \u00e0 un autre middleware de rack ou simplement r\u00e9pondre avec un code de r\u00e9ponse, un type de contenu et un corps.<\/p>\n

1 [200, {'Content-type' => 'text\/html'},['Bonjour Web']]<\/p>\n\n

Comment pouvez-vous l'utiliser dans une application Rails<\/strong>?<\/h5>\n

Des rails<\/strong><\/a> dispose d\u00e9j\u00e0 d'un ensemble pr\u00e9d\u00e9fini de middlewares Rack pour la mise en cache, la gestion des sessions, etc., vous pouvez consulter les middlewares actuels en ex\u00e9cutant le middleware rake.<\/p>\n

En dehors de cela, Rails constitue \u00e9galement un excellent moyen d'ajouter votre propre middleware Rack \u00e0 votre application. L'utilisation d'un middleware Rack pour g\u00e9rer la saisie semi-automatique est excellente, car elle vous donne une l\u00e9g\u00e8re am\u00e9lioration des performances par rapport \u00e0 la gestion de la requ\u00eate dans un contr\u00f4leur Rails.<\/p>\n

Examinons donc un peu de code pour savoir comment y parvenir. Exigence \u2013 L'utilisateur doit \u00eatre authentifi\u00e9 \u2013 R\u00e9pondre avec json avec le r\u00e9sultat de la requ\u00eate \u2013 G\u00e9rer la r\u00e9ponse c\u00f4t\u00e9 client avec javascript.<\/p>\n

Ruby Rack Middleware - Cr\u00e9ez un r\u00e9pertoire pour les middlewares dans votre application rails mkdir app\/middleware.<\/p>\n

Cr\u00e9er un nouveau fichier app\/middleware\/auto_completer.rb class AutoCompleter def initialize(app) @app = app end def call(env) @request = Rack::Request.new(env) if env["PATH_INFO"] == " \/autocomplete" session = @request.env['rack.session'] params = @request.params if session && session["user_id"].present? users = User.select("id, name").like(params["q"]) [200, {"Content-Type" => "application\/json"}, [users.to_json]] else [404, {"Content-Type" => "text\/html"}, ["Not Found"]] end else @app.call(env) end end end.<\/p>\n

Le code ci-dessus est initialis\u00e9 avec une instance d'application rack, puis transmet le contr\u00f4le \u00e0 la m\u00e9thode d'appel. Dans la m\u00e9thode d'appel, nous v\u00e9rifions si le chemin de la requ\u00eate correspond \u00e0 la saisie semi-automatique. Nous v\u00e9rifions ensuite la session, trouvons les utilisateurs correspondants et renvoyons un json avec une r\u00e9ponse 200.<\/p>\n

Si la requ\u00eate ne correspond pas au chemin de la requ\u00eate de saisie semi-automatique, nous passons le contr\u00f4le \u00e0 l'autre middleware du rack. Modifiez votre config\/application.rb pour configurer Rails afin qu'il r\u00e9cup\u00e8re le nouveau middleware<\/p>\n

config.middleware.insert_after ActionDispatch :: Session :: CookieStore, \u00ab\u00a0AutoCompleter\u00a0\u00bb<\/p>\n

Cela indique \u00e0 Rails d'ins\u00e9rer le nouveau middleware que nous avons cr\u00e9\u00e9 apr\u00e8s le middleware de session. Ex\u00e9cutez \u00e0 nouveau la commande pour voir que le nouveau middleware a \u00e9t\u00e9 ajout\u00e9 apr\u00e8s<\/p>\n

ActionDispatch :: Session :: Middleware de r\u00e2teau CookieStore<\/p>\n

D\u00e9marrez votre serveur Rails et acc\u00e9dez \u00e0 localhost:3000\/autocomplete?q=h<\/p>\n

R\u00e9ponse attendue [{"id":2,"name":"Harry"},{"id":4,"name":"Harold"}]<\/p>\n

Javascript Nous utiliserons le plugin jquery-ui pour la saisie semi-automatique. Inclure jquery-ui dans actifs\/javascript\/application.js<\/p>\n

Ajoutez JavaScript \u00e0 assets\/javascript\/application.js pour effectuer la demande de saisie semi-automatique<\/p>\n

$(function() { $.ui.autocomplete.prototype._renderItem = function (ul, item) { label = item.name.replace(new RegExp(\u201c(?![^&;]+;)(?!< [^<>]*)(\u201d + $.ui.autocomplete.escapeRegex(this.term) + \u201c)(?![^<>]*>)(?![^&;]+;)\u201d, \u201c gi"), "$1<\/strong>"\u00a0); retourner $("<\/p>\n\n