Inicio rápido: Incorporación de Web PubSub para Socket.IO en la aplicación

En este inicio rápido se muestra cómo crear un recurso de Web PubSub para Socket.IO e incorporarlo rápidamente en la aplicación de Socket.IO para simplificar el desarrollo, acelerar la implementación y lograr escalabilidad sin complejidad.

El código que se muestra en este inicio rápido está en CommonJS. Si desea usar un módulo ECMAScript, consulte la demostración de chat para Socket.IO con Azure Web PubSub.

Requisitos previos

Creación de un recurso de Web PubSub para Socket.IO

Para crear un recurso de Web PubSub para Socket.IO, puede usar este botón de un solo clic para crear o seguir las acciones siguientes para buscar en Azure Portal.

• Use el botón siguiente para crear un recurso de Web PubSub para Socket.IO en Azure

  

• Búsqueda desde la barra de búsqueda de Azure Portal

  1. Vaya a Azure Portal.

  2. Busque socket.io, en la barra de búsqueda y seleccione Web PubSub para Socket.IO.

     

• Búsqueda desde Marketplace

  1. Vaya a Azure Portal.

  2. Seleccione el botón Crear un recurso de la esquina superior izquierda de Azure Portal. Escriba socket.io en el cuadro de búsqueda y presione Entrar. Seleccione Web PubSub para Socket.IO en el resultado de la búsqueda.

     

  3. Haga clic en Crear en la página emergente.

     

Envío de mensajes con bibliotecas de Socket.IO y Web PubSub para Socket.IO

En los pasos siguientes, creará un proyecto de Socket.IO y realizará la integración con Web PubSub para Socket.IO.

Inicializar un proyecto Node e instalar los paquetes necesarios

mkdir quickstart
cd quickstart
npm init
npm install @azure/web-pubsub-socket.io socket.io-client

Escribir código de servidor

Cree un archivo server.js y agregue el código siguiente para crear un servidor Socket.IO e integrarlo con Web PubSub para Socket.IO.

Las cadenas de conexión sin procesar solo aparecen en este artículo con fines de demostración. En entornos de producción, proteja siempre las claves de acceso. Use Azure Key Vault para administrar y rotar las claves de forma segura y proteja la conexión con WebPubSubServiceClient.

/*server.js*/
const { Server } = require("socket.io");
const { useAzureSocketIO } = require("@azure/web-pubsub-socket.io");

let io = new Server(3000);

// Use the following line to integrate with Web PubSub for Socket.IO
useAzureSocketIO(io, {
    hub: "Hub", // The hub name can be any valid string.
    connectionString: process.argv[2]
});

io.on("connection", (socket) => {
    // Sends a message to the client
    socket.emit("hello", "world");

    // Receives a message from the client
    socket.on("howdy", (arg) => {
        console.log(arg);   // Prints "stranger"
    })
});

Escribir código de cliente

Cree un archivo client.js y agregue el código siguiente para conectar el cliente con Web PubSub para Socket.IO.

/*client.js*/
const io = require("socket.io-client");

const socket = io("<web-pubsub-socketio-endpoint>", {
    path: "/clients/socketio/hubs/Hub",
});

// Receives a message from the server
socket.on("hello", (arg) => {
    console.log(arg);
});

// Sends a message to the server
socket.emit("howdy", "stranger")

Cuando se usa Web PubSub para Socket.IO, se requieren <web-pubsub-socketio-endpoint> y path para que el cliente se conecte al servicio. <web-pubsub-socketio-endpoint> y path pueden encontrarse en Azure Portal.

1. Vaya al panel clave de Web PubSub para Socket.IO

2. Escriba el nombre del centro y copie el punto de conexión de cliente y la ruta de acceso de cliente

   

Ejecución de la aplicación

1. Ejecute la aplicación del servidor:

   node server.js "<connection-string>"
   

   <connection-string> es la cadena de conexión que contiene el punto de conexión y las claves para acceder al recurso de Web PubSub para Socket.IO. También puede encontrar la cadena de conexión en Azure Portal

   

2. Ejecute la aplicación cliente en otro terminal:

   node client.js