Início Rápido: Incorporar o Web PubSub para Socket.IO em seu aplicativo

Este início rápido demonstra como criar um recurso do Web PubSub para Socket.IO e incorporá-lo rapidamente em seu aplicativo Socket.IO para simplificar o desenvolvimento, acelerar a implantação e alcançar a escalabilidade sem complexidade.

O código mostrado neste início rápido está no CommonJS. Se você quiser usar um módulo ECMAScript, consulte a demonstração de chat para Socket.IO com o Azure Web PubSub.

Importante

As cadeias de conexão brutas aparecem neste artigo somente para fins de demonstração.

Uma cadeia de conexão inclui as informações de autorização que sua aplicação precisa para acessar o serviço Azure Web PubSub. A chave de acesso na cadeia de conexão funciona como uma senha root para o seu serviço. Em ambientes de produção, sempre proteja suas chaves de acesso. Use o Azure Key Vault para gerenciar e girar suas chaves com segurança e proteger sua conexão com WebPubSubServiceClient.

Evite distribuir chaves de acesso para outros usuários, fazer hard-coding com elas ou salvá-las em qualquer lugar em texto sem formatação que seja acessível a outras pessoas. Gire suas chaves se você acredita que elas podem ter sido comprometidas.

Pré-requisitos

• Uma conta do Azure com uma assinatura ativa. Se você não tiver uma, poderá criar uma conta gratuita.
• Alguma familiaridade com a biblioteca de Socket.IO.

Criar um recurso Web PubSub no Socket.IO

Para criar um Web PubSub para Socket.IO, você pode usar o botão de um clique a seguir para criar ou seguir as ações abaixo para pesquisar no portal do Azure.

• Use o botão a seguir para criar um recurso do Web PubSub para Socket.IO no Azure

  

• Pesquisar na barra de pesquisa do portal do Azure

  1. Acesse o portal do Azure.

  2. Pesquise socket.io, na barra de pesquisa e selecione Web PubSub para Socket.IO.

     

• Pesquisar no Marketplace

  1. Acesse o portal do Azure.

  2. Selecione o botão Criar um recurso localizado no canto superior esquerdo do portal do Azure. Digite socket.io na caixa de pesquisa e pressione enter. SelecioneWeb PubSub para Socket.IO no resultado da pesquisa.

     

  3. Clique em Criar na página pop-out.

     

Como enviar mensagens com bibliotecas Socket.IO e Web PubSub para Socket.IO

Nas etapas a seguir, você cria um projeto Socket.IO e integra-se ao Web PubSub para Socket.IO.

Inicialize um projeto Node e instale os pacotes necessários

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

Escrever código do servidor

Crie um arquivo server.js e adicione o código a seguir para criar um servidor Socket.IO e integrar-se ao Web PubSub para Socket.IO.

As cadeias de conexão brutas aparecem neste artigo somente para fins de demonstração. Em ambientes de produção, sempre proteja suas chaves de acesso. Use o Azure Key Vault para gerenciar e girar suas chaves com segurança e proteger sua conexão com 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"
    })
});

Escrever código do cliente

Crie um arquivo client.js e adicione o código a seguir para conectar o cliente ao 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")

Quando você usa o Web PubSub para Socket.IO, <web-pubsub-socketio-endpoint> e path são necessários para que o cliente se conecte ao serviço. <web-pubsub-socketio-endpoint> e path podem ser encontrados no portal do Azure.

1. Vá para a seção chave do Web PubSub para Socket.IO

2. Digite o nome do hub e copie o Endpoint do cliente e o Caminho do cliente

   

Executar o aplicativo

1. Execute o aplicativo do servidor:

   node server.js "<connection-string>"
   

   A <connection-string> é a cadeia de conexão que contém o endpoint e as chaves para acessar seu recurso Web PubSub para Socket.IO. Você também pode encontrar a cadeia de conexão no portal do Azure

   

2. Execute o aplicativo cliente em outro terminal:

   node client.js