Cómo implementar WebSockets en Rails 4

WebSockets se puede implementar en Rails5 usando ActionCable. Se puede utilizar para habilitar muchas funciones como chats, notificaciones y otros módulos en tiempo real. Pero, ¿cómo se logra el mismo objetivo sin ActionCable y Rails 5? Este blog trata sobre cómo podemos implementar WebSockets en Rails 4.

Antes de comenzar, echemos un vistazo rápido al concepto de WebSockets.

¿Qué son los WebSockets y cómo funcionan?

La mayor parte de la web se basa en solicitudes / respuestas HTTP. Permiten la comunicación de muchos hosts y clientes a través de transportes TCP / IP. Esto significa que las aplicaciones web generalmente no hacen nada después de que un usuario las visita en un navegador, analiza la solicitud y envía una respuesta. Hasta que el usuario haga clic en algo en la página, el servidor no recibirá ninguna nueva solicitud HTTP. Por lo tanto, permanecerá inactivo.

Existen tecnologías que permiten al servidor iniciar la comunicación con el cliente cuando hay datos para enviar. Algunos ejemplos son "Push" o "Comet". Existe la técnica de sondeo largo que mantiene abierta una conexión HTTP una vez que un cliente se conecta al servidor. Lo malo de estos enfoques es la sobrecarga de HTTP. No es muy bueno para aplicaciones de baja latencia.

Aquí es donde WebSockets entra en escena. Son una API que proporciona conexiones persistentes de "socket" entre un servidor y un cliente. Esto permite que tanto el servidor como el cliente envíen datos en cualquier momento.

En este blog, crearemos un sitio de subastas de jugadores de cricket en línea que utiliza conectores web en Rails 4. Varios usuarios pueden utilizar el sitio para pujar por el mismo jugador. El desafío es actualizar la oferta sin volver a cargar la página y mantener la comunicación en vivo.

Empezando

Se utilizan principalmente tres gemas para implementar la funcionalidad del conector web:

Gemfile

gem ‘faye’gem ‘thin’, require: falsegem ‘render_sync’

El delgado es un servidor ruby ​​pequeño y rápido. Debe instalarse con faye, ya que la gema faye no funciona con servidores como webrick.

La siguiente joya importante es faye . Faye es un conjunto de herramientas para la mensajería simple de publicación y suscripción entre clientes web. Se envía con servidores de enrutamiento de mensajes fáciles de usar para aplicaciones Node.js y Rack, y clientes que se pueden usar en el servidor y en el navegador.

La gema sync o render_sync se usa para crear parciales en tiempo real con Rails. Sync le permite renderizar parciales para modelos que, con un código mínimo, se actualizan en tiempo real en el navegador cuando ocurren cambios en el servidor.

Nuestro objetivo es tener una funcionalidad que permita mostrar los valores de la oferta en la página de presentación de un usuario. El primer paso para implementar esto es instalar plantillas desde la gema de sincronización.

rieles generan sincronización: instalar

Y requiere sincronización en nuestra cartera de activos.

app / assets / javascripts / application.js

//= require jquery//= require jquery_ujs//= require turbolinks//= require sync//= require_tree

El script de configuración es necesario en el diseño de la aplicación.

app / views / layouts / application.html.erb

Necesitamos crear un parcial y almacenarlo en el directorio views / sync / como _bid_log_row.html.erb.

Este parcial contiene el valor de la oferta del usuario. Se verá así:

Current Bid: 

Y para representar esto en la página de presentación, agregue las siguientes líneas en la página de presentación de usuarios:

app / views / users / show.html.erb

Y, por último, realice los cambios en BidLogsController para que sepa cómo manejar los envíos de formularios remotos. También sincroniza las nuevas ofertas en su lugar.

class BidLogsController < ApplicationControllerrespond_to :html, :js
 def index @bid_logs = BidLog.all @new_bid = current_user.bid_logs.build end
 def create @bid_log = current_user.bid_logs.build(bid_log_params) if @bid_log.save sync_new @bid_log end respond_to do |format| format.html { redirect_to user_path(@bid_log.player_id) } format.json { head :no_content } end end
private
 def bid_log_params params.require(:bid_log).permit(:amount, :player_id) end
end

Configuración

Ahora la parte básica de codificación está lista. El siguiente paso es configurar Faye. Faye necesita ejecutarse en un servidor web separado de la propia aplicación web. Para lograr esto, necesita crear un archivo de configuración de Rackup. Agregue un archivo faye.ru a la raíz del proyecto y asegúrese de que se vea así:

require ‘faye’
bayeux = Faye::RackAdapter.new(:mount => ‘/faye’, :timeout => 25)
bayeux.listen(9292)

Este archivo simplemente le dice a Rackup cómo iniciar el servidor Faye. Pruébelo para asegurarse de que funciona correctamente. Ejecute esto en su Terminal:

rackup faye.ru -E production -s thin

Terminando

Ahora estamos listos para irnos. La aplicación se puede ejecutar iniciando el servidor Rails. El código asociado con este blog se puede encontrar aquí.