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

Artigo
09/14/2023

Este início rápido demonstra como criar um Web PubSub para Socket.IO recurso 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.

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 Web PubSub para Socket.IO recurso

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 em 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 portal do Azure
1. Vá para o Portal do Azure.
2. Pesquise socket.io, na barra de pesquisa e selecione Web PubSub para Socket.IO.
Pesquisar no Marketplace
1. Vá para 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. Selecione o Web PubSub para Socket.IO no resultado da pesquisa.
3. Clique em Criar na página pop-out.

Enviar mensagens com bibliotecas de 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.

Inicializar um projeto do Nó e instalar 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 server.js arquivo e adicione o código a seguir para criar um servidor Socket.IO e integrar-se ao Web PubSub para Socket.IO.

/*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 client.js arquivo 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 é necessário que o cliente se conecte ao serviço. O <web-pubsub-socketio-endpoint> e path podem ser encontrados em portal do Azure.

Vá para a folha de chaves do Web PubSub para Socket.IO
Digite o nome do hub e copie o Ponto de Extremidade do Cliente e o Caminho do Cliente

Executar o aplicativo

Execute o aplicativo de servidor:
```
node server.js "<connection-string>"
```
O <connection-string> é a cadeia de conexão que contém o ponto de extremidade e as chaves para acessar o Web PubSub para Socket.IO recurso. Você também pode encontrar a cadeia de conexão no portal do Azure
Execute o aplicativo cliente em outro terminal:
```
node client.js
```

Share via