Implementar mensagens em tempo real com WebSocket - Server Load Balancer: Central de Documentação do Alibaba Cloud

O WebSocket é um protocolo de rede que fornece um canal de comunicação full-duplex sobre uma única conexão TCP. Ele estabelece uma conexão persistente entre cliente e servidor, permitindo que ambos enviem e recebam dados a qualquer momento. Isso evita a sobrecarga e a latência associadas ao estabelecimento repetido de novas conexões, tornando-o mais eficiente que o modelo tradicional de requisição e resposta HTTP. O WebSocket é utilizado principalmente em aplicações que exigem comunicação em tempo real. O ALB oferece suporte nativo ao protocolo WebSocket.

Introdução ao WebSocket

Por que usar o WebSocket

Com a evolução das tecnologias web, as aplicações demandam cada vez mais que os servidores enviem dados em tempo real para funcionalidades como salas de bate-papo ao vivo e comentários instantâneos. O método tradicional de polling, no qual o navegador do cliente envia requisições HTTP repetidamente ao servidor para obter os dados mais recentes, apresenta desvantagens significativas. Requisições frequentes com cabeçalhos HTTP grandes e cargas úteis de dados pequenas aumentam a carga do servidor e desperdiçam largura de banda.

Para resolver esses problemas, o HTML5 introduziu o protocolo WebSocket, que oferece uma solução mais eficiente para a comunicação entre cliente e servidor. O WebSocket suporta comunicação full-duplex, o que significa que servidor e cliente podem enviar e receber dados simultaneamente. Isso permite que o servidor envie proativamente novos dados ao cliente sem aguardar uma requisição de polling. Esse mecanismo de comunicação bidirecional e em tempo real melhora a eficiência da transferência de dados, reduz requisições de rede desnecessárias e economiza recursos do servidor e largura de banda, proporcionando uma experiência de usuário mais fluida e responsiva.

Principais recursos do WebSocket

A comunicação começa com um handshake TCP padrão de três vias. Em seguida, o cliente envia uma requisição HTTP especial, conhecida como handshake de upgrade de protocolo. Após a conclusão bem-sucedida desse handshake, a conexão muda de HTTP para WebSocket. Toda a comunicação subsequente entre cliente e servidor utiliza o protocolo WebSocket, permitindo a troca bidirecional de dados pela mesma conexão.

Uma vez estabelecida, a conexão WebSocket permanece ativa. Essa conexão persistente e de baixa latência permite a transferência contínua e bidirecional de dados, o que aumenta a eficiência da troca de informações.

O WebSocket comunica-se por meio de frames de dados, que possuem seu próprio formato de protocolo de frame com cabeçalhos concisos. Os dados podem ser transmitidos como texto ou binário. Esse método reduz a sobrecarga do protocolo em conexões persistentes, tornando a interação de rede mais eficiente. Ele economiza recursos do servidor e largura de banda, ao mesmo tempo que proporciona uma experiência interativa em tempo real mais fluida.

Para obter mais informações sobre o protocolo WebSocket, consulte a documentação oficial The WebSocket Protocol.

Casos de uso do WebSocket

O WebSocket é ideal para aplicações que exigem comunicação bidirecional rápida e em tempo real, como aplicações de IA, salas de bate-papo online, sistemas de notificação em tempo real, jogos online multiplayer e feeds de dados de mercado em tempo real.

Cenário de exemplo

Uma empresa deseja implantar uma aplicação de bate-papo online baseada na web no Alibaba Cloud. Os usuários acessam o serviço de backend por meio de um nome de domínio para comunicação em tempo real. Como se trata de uma aplicação de mensagens instantâneas, ela requer baixa latência e comunicação bidirecional eficiente e em tempo real.

O serviço de site da empresa enfrenta desafios relacionados a alta concorrência e gerenciamento de conexões persistentes. À medida que o número de usuários cresce, o modelo HTTP tradicional não consegue suportar muitos usuários simultâneos na comunicação em tempo real, pois cada interação exige uma nova conexão. Isso resulta em um aumento abrupto na carga do servidor e em baixo desempenho.

Nesse cenário, o uso do ALB com o protocolo WebSocket gerencia eficazmente as conexões persistentes sob alta concorrência. A implantação da aplicação em um grupo de servidores e o uso do Redis para sincronização de mensagens garantem alta disponibilidade. Isso fornece uma solução de mensagens em tempo real confiável e eficiente para a aplicação de sala de bate-papo online.

Observações de uso

Os listeners HTTP em uma instância ALB suportam o protocolo WebSocket por padrão. O ALB oferece suporte a atualizações contínuas, o que significa que alterações de configuração não interrompem conexões persistentes existentes.

Observe o seguinte:

Se a conexão entre uma instância ALB e um servidor de backend usar uma versão específica do HTTP, como HTTP/1.1, recomenda-se que o servidor de backend também ofereça suporte a essa versão do HTTP.
O tempo limite padrão de requisição de conexão para um listener HTTP é de 60 segundos. Caso nenhuma troca de dados ocorra entre o ALB e um servidor de backend por mais de 60 segundos, o ALB encerra a conexão.
- Se o tempo limite padrão de 60 segundos for insuficiente para suas necessidades, modifique o parâmetro Connection Request Timeout do listener.
- Para manter a conexão aberta, implemente um mecanismo de keepalive para trocar pacotes pelo menos uma vez a cada 60 segundos.

Pré-requisitos

É necessária uma instância ALB voltada para a internet. Para obter mais informações, consulte Criar e gerenciar uma instância ALB.
São necessárias três instâncias ECS: ECS01, ECS02 e ECS03.
- As instâncias ECS01 e ECS02 são usadas para implantar a aplicação WebSocket, e a ECS03 é usada para implantar o Redis.
- Neste tutorial, todos os servidores executam o CentOS 7.9.
- Recomenda-se colocar as instâncias ECS01, ECS02 e ECS03 no mesmo grupo de segurança. Se elas estiverem em grupos de segurança diferentes, configure regras que permitam o tráfego nas portas de comunicação necessárias entre os servidores.
É necessário um nome de domínio registrado com registro ICP concluído. Para obter mais informações, consulte Registrar um nome de domínio no Alibaba Cloud e Registro ICP.

Procedimento

Etapa 1: Implantar serviços

Implante o Redis na instância ECS03 e a aplicação WebSocket nas instâncias ECS01 e ECS02.

Este tópico utiliza uma sala de bate-papo online simples baseada em Python no CentOS 7.9 para fins de demonstração. Este exemplo serve apenas como referência. Em um ambiente de produção, utilize sua própria aplicação.

Implantar o Redis na ECS03

Faça login na instância ECS03.

Copie e execute os comandos a seguir para instalar e configurar o Redis.

# Install EPEL (Extra Packages for Enterprise Linux)
sudo yum install epel-release -y
# Install Redis
sudo yum install redis -y
# Start and enable the Redis service
sudo systemctl start redis
sudo systemctl enable redis
# Edit the Redis configuration file to allow remote connections
sudo sed -i 's/^bind 127.0.0.1$/bind 0.0.0.0/' /etc/redis.conf
sudo sed -i 's/^protected-mode yes/protected-mode no/' /etc/redis.conf
# Restart the Redis service for the changes to take effect
sudo systemctl restart redis
# Check the Redis status
sudo systemctl status redis

Se os comandos forem executados sem erros e a saída mostrar que o serviço Redis está no estado active (running), a implantação e a configuração foram bem-sucedidas.

● redis.service - Redis persistent key-value database
   Loaded: loaded (/usr/lib/systemd/system/redis.service; enabled; vendor preset: disabled)
   Active: active (running) since ...
 Main PID: 12345 (redis-server)
   CGroup: /system.slice/redis.service
           └─12345 /usr/bin/redis-server 0.0.0.0:6379

Implantar o WebSocket na ECS01

Faça login na instância ECS01.
Execute sudo pip3 install flask flask-socketio flask-cors redis para instalar as dependências.
Execute vi ECS01_ws.py e pressione a tecla i para entrar no modo de edição.

Copie e cole o código a seguir:

Código de exemplo para o serviço de teste

Nota

Na linha 13, substitua o endereço IP em redis_url pelo endereço IP do seu servidor Redis (ECS03).

import os
import redis
from flask import Flask, render_template, request
from flask_cors import CORS
from flask_socketio import SocketIO, emit, disconnect
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
# Enable Cross-Origin Resource Sharing (CORS)
CORS(app)
# Configure Redis as the message queue and state store
redis_url = "redis://192.168.*.*:6379/0"  # Replace with the IP address of your Redis server
redis_client = redis.StrictRedis.from_url(redis_url)
# Set the log level to DEBUG for easier debugging
socketio = SocketIO(app, message_queue=redis_url, manage_session=True, logger=True, engineio_logger=True, cors_allowed_origins="*")
SESSION_PREFIX = "session:"
def set_session_data(session_id, key, value):
    redis_client.hset(f"{SESSION_PREFIX}{session_id}", key, value)
def get_session_data(session_id, key):
    return redis_client.hget(f"{SESSION_PREFIX}{session_id}", key)
def delete_session_data(session_id):
    redis_client.delete(f"{SESSION_PREFIX}{session_id}")
@app.route('/')
def index():
    return render_template('index.html')
@socketio.on('connect')
def handle_connect():
    try:
        session_id = request.sid  # Get the client's session ID
        print(f"Session {session_id} connected.")
        welcome_message = "You have entered the chat room!"
        emit('message', welcome_message)
        set_session_data(session_id, "username", '')  # Initialize the username as empty
    except Exception as e:
        print(f"Error during connection: {str(e)}")
@socketio.on('disconnect')
def handle_disconnect():
    try:
        session_id = request.sid
        username = get_session_data(session_id, "username")
        if username:
            username = username.decode()
            leave_message = f"{username} has left the chat room."
            emit('message', leave_message, broadcast=True)
            print(leave_message)
        delete_session_data(session_id)
        print(f"Session {session_id} disconnected.")
    except Exception as e:
        print(f"Error during disconnection: {str(e)}")
@socketio.on('set_username')
def handle_set_username(username):
    session_id = request.sid
    set_session_data(session_id, "username", username)
    print(f"Username for client {session_id} set to {username}")
    emit('message', f"Your username has been set to: {username}")
@socketio.on('message')
def handle_message(msg):
    session_id = request.sid
    username = get_session_data(session_id, "username")
    if username:
        username = username.decode()
        formatted_message = f"{username}: {msg}"
        emit('message', formatted_message, broadcast=True)
        print(formatted_message)
    else:
        warning_message = "Failed to send message: Please set a username first."
        emit('message', warning_message)
        print(warning_message)
if __name__ == '__main__':
    # Make sure the templates directory exists
    if not os.path.exists('templates'):
        os.makedirs('templates')
    # Use the Flask template (index.html)
    html_code = '''<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Chat Room</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 0;
            padding: 0;
            background-color: #f0f0f0;
        }
        h1 {
            color: #333;
        }
        .chat-container {
            width: 90%;
            max-width: 600px;
            background: white;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
        .user-container, .message-container {
            display: flex;
            margin-bottom: 10px;
        }
        .user-container input, .message-container input {
            flex: 1;
            padding: 10px;
            margin-right: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        .message-container {
            margin-top: 10px;
        }
        button {
            padding: 10px;
            background-color: #0056b3;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        button:hover {
            background-color: #004099;
        }
        #messages {
            border: 1px solid #ccc;
            padding: 10px;
            height: 300px;
            overflow-y: scroll;
            margin-bottom: 10px;
            border-radius: 4px;
            background-color: #f9f9f9;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1>Online Chat Room</h1>
    <div class="chat-container">
        <div class="user-container">
            <input type="text" id="username" autocomplete="off" placeholder="Enter a username">
            <button onclick="setUsername()">Set Username</button>
        </div>
        <div id="messages"></div>
        <div class="message-container">
            <input type="text" id="myMessage" autocomplete="off" placeholder="Enter a message...">
            <button onclick="sendMessage()">Send</button>
        </div>
    </div>
    <script>
        var socket = io({ transports: ['websocket', 'polling', 'flashsocket'] });
        var usernameSet = false;
        socket.on('connect', function() {
            console.log("Connected to the server!");
            socket.on('message', function(msg){
                $('#messages').append($('<div>').text(msg));
                $('#messages').scrollTop($('#messages')[0].scrollHeight);
            });
        });
        function setUsername() {
            var username = $('#username').val();
            if (username) {
                socket.emit('set_username', username);
                usernameSet = true;  // Mark that username is set.
            } else {
                alert("Username cannot be empty!");
            }
        }
        function sendMessage() {
            if (usernameSet) {
                var message = $('#myMessage').val();
                if (message) {
                    socket.send(message);
                    $('#myMessage').val('');
                } else {
                    alert("Message cannot be empty!");
                }
            } else {
                alert("Please set a username first!");
            }
        }
    </script>
</body>
</html>
'''
    # Save the template to a file
    with open('templates/index.html', 'w') as file:
        file.write(html_code)
    socketio.run(app, host='0.0.0.0', port=5000)

Pressione a tecla Esc e insira :wq para salvar as alterações.
Execute o comando sudo python3 ECS01_ws.py para iniciar o script.

Quando a saída a seguir for exibida, a aplicação WebSocket terá sido iniciada na porta 5000.

Server initialized for threading.
 * Serving Flask app 'ECS01_ws' (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: off
 * Running on all addresses.
   WARNING: This is a development server. Do not use it in a production deployment.
 * Running on http://192.168.*.*:5000/ (Press CTRL+C to quit)

Se a aplicação falhar ao iniciar, verifique se a porta já está em uso ou se você copiou os comandos ou o código incorretamente.

● redis.service – Redis persistent key-value database
   Loaded: loaded (/usr/lib/systemd/system/redis.service; enabled; vendor preset: disabled)
  Drop-In: /etc/systemd/redis.service.d
           └─limit.conf
   Active: active (running) since Thu 2xxx xxx xxx xxx CST; 6s ago
  Process: 14715 ExecStop=/usr/libexec/redis-shutdown (code=exited, status=0/SUCCESS)
 Main PID: 14730 (redis-server)
   CGroup: /system.slice/redis.service
           └─14730 /usr/bin/redis-server 0.0.0.0:6379

Implantar o WebSocket na ECS02

Faça login na instância ECS02.
Execute sudo pip3 install flask flask-socketio flask-cors redis para instalar as dependências.
Execute vi ECS02_ws.py e pressione a tecla i para entrar no modo de edição.

Copie e cole o código a seguir:

Código de exemplo para o serviço de teste

Nota

Na linha 13, substitua o endereço IP em redis_url pelo endereço IP do seu servidor Redis (ECS03).

import os
import redis
from flask import Flask, render_template, request
from flask_cors import CORS
from flask_socketio import SocketIO, emit, disconnect
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
# Enable Cross-Origin Resource Sharing (CORS)
CORS(app)
# Configure Redis as the message queue and state store
redis_url = "redis://192.168.*.*:6379/0"  # Replace with the IP address of your Redis server
redis_client = redis.StrictRedis.from_url(redis_url)
# Set the log level to DEBUG for easier debugging
socketio = SocketIO(app, message_queue=redis_url, manage_session=True, logger=True, engineio_logger=True, cors_allowed_origins="*")
SESSION_PREFIX = "session:"
def set_session_data(session_id, key, value):
    redis_client.hset(f"{SESSION_PREFIX}{session_id}", key, value)
def get_session_data(session_id, key):
    return redis_client.hget(f"{SESSION_PREFIX}{session_id}", key)
def delete_session_data(session_id):
    redis_client.delete(f"{SESSION_PREFIX}{session_id}")
@app.route('/')
def index():
    return render_template('index.html')
@socketio.on('connect')
def handle_connect():
    try:
        session_id = request.sid  # Get the client's session ID
        print(f"Session {session_id} connected.")
        welcome_message = "You have entered the chat room!"
        emit('message', welcome_message)
        set_session_data(session_id, "username", '')  # Initialize the username as empty
    except Exception as e:
        print(f"Error during connection: {str(e)}")
@socketio.on('disconnect')
def handle_disconnect():
    try:
        session_id = request.sid
        username = get_session_data(session_id, "username")
        if username:
            username = username.decode()
            leave_message = f"{username} has left the chat room."
            emit('message', leave_message, broadcast=True)
            print(leave_message)
        delete_session_data(session_id)
        print(f"Session {session_id} disconnected.")
    except Exception as e:
        print(f"Error during disconnection: {str(e)}")
@socketio.on('set_username')
def handle_set_username(username):
    session_id = request.sid
    set_session_data(session_id, "username", username)
    print(f"Username for client {session_id} set to {username}")
    emit('message', f"Your username has been set to: {username}")
@socketio.on('message')
def handle_message(msg):
    session_id = request.sid
    username = get_session_data(session_id, "username")
    if username:
        username = username.decode()
        formatted_message = f"{username}: {msg}"
        emit('message', formatted_message, broadcast=True)
        print(formatted_message)
    else:
        warning_message = "Failed to send message: Please set a username first."
        emit('message', warning_message)
        print(warning_message)
if __name__ == '__main__':
    # Make sure the templates directory exists
    if not os.path.exists('templates'):
        os.makedirs('templates')
    # Use the Flask template (index.html)
    html_code = '''<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Chat Room</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 0;
            padding: 0;
            background-color: #f0f0f0;
        }
        h1 {
            color: #333;
        }
        .chat-container {
            width: 90%;
            max-width: 600px;
            background: white;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
        .user-container, .message-container {
            display: flex;
            margin-bottom: 10px;
        }
        .user-container input, .message-container input {
            flex: 1;
            padding: 10px;
            margin-right: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        .message-container {
            margin-top: 10px;
        }
        button {
            padding: 10px;
            background-color: #0056b3;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        button:hover {
            background-color: #004099;
        }
        #messages {
            border: 1px solid #ccc;
            padding: 10px;
            height: 300px;
            overflow-y: scroll;
            margin-bottom: 10px;
            border-radius: 4px;
            background-color: #f9f9f9;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1>Online Chat Room</h1>
    <div class="chat-container">
        <div class="user-container">
            <input type="text" id="username" autocomplete="off" placeholder="Enter a username">
            <button onclick="setUsername()">Set Username</button>
        </div>
        <div id="messages"></div>
        <div class="message-container">
            <input type="text" id="myMessage" autocomplete="off" placeholder="Enter a message...">
            <button onclick="sendMessage()">Send</button>
        </div>
    </div>
    <script>
        var socket = io({ transports: ['websocket', 'polling', 'flashsocket'] });
        var usernameSet = false;
        socket.on('connect', function() {
            console.log("Connected to the server!");
            socket.on('message', function(msg){
                $('#messages').append($('<div>').text(msg));
                $('#messages').scrollTop($('#messages')[0].scrollHeight);
            });
        });
        function setUsername() {
            var username = $('#username').val();
            if (username) {
                socket.emit('set_username', username);
                usernameSet = true;  // Mark that username is set.
            } else {
                alert("Username cannot be empty!");
            }
        }
        function sendMessage() {
            if (usernameSet) {
                var message = $('#myMessage').val();
                if (message) {
                    socket.send(message);
                    $('#myMessage').val('');
                } else {
                    alert("Message cannot be empty!");
                }
            } else {
                alert("Please set a username first!");
            }
        }
    </script>
</body>
</html>
'''
    # Save the template to a file
    with open('templates/index.html', 'w') as file:
        file.write(html_code)
    socketio.run(app, host='0.0.0.0', port=5000)

Pressione a tecla Esc e insira :wq para salvar as alterações.
Execute o comando sudo python3 ECS02_ws.py para iniciar o script.

Quando a saída a seguir for exibida, a aplicação WebSocket terá sido iniciada na porta 5000.

Server initialized for threading.
 * Serving Flask app 'ECS02_ws' (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: off
 * Running on all addresses.
   WARNING: This is a development server. Do not use it in a production deployment.
 * Running on http://192.168.*.*:5000/ (Press CTRL+C to quit)

Se a aplicação falhar ao iniciar, verifique se a porta já está em uso ou se você copiou os comandos ou o código incorretamente.

Etapa 2: Configurar um grupo de servidores

Faça login no console do ALB.
Na barra de navegação superior, selecione a região onde a instância está implantada.
No painel de navegação à esquerda, clique em Server Group.

Clique em Create Server Group. Na página Create Server Group, configure os parâmetros a seguir, mantenha os demais com seus valores padrão e clique em Create.

Parâmetro

Descrição

Server Group Type

Selecione Server.

VPC

Selecione a VPC onde os servidores de backend ECS01 e ECS02 estão localizados.

Os servidores de backend devem estar na mesma VPC que a instância ALB.

Na caixa de diálogo The server group is created, clique em Add Backend Server.
Na página Add Backend Server, selecione as instâncias ECS01 e ECS02 e adicione-as ao grupo de servidores. Defina a porta delas como 5000, que é a porta utilizada pela aplicação WebSocket neste tutorial.

Etapa 3: Configurar um listener HTTP

Faça login no console do ALB.
Na barra de navegação superior, selecione a região onde a instância está implantada.
No painel de navegação à esquerda, selecione Instances.
Na página Instances, localize a instância desejada e clique em Create Listener na coluna Actions.

Na página Configure Listener, configure os parâmetros a seguir e mantenha os demais com seus valores padrão. Em seguida, clique em Next.

Parâmetro	Descrição
Select Listener Protocol	Selecione HTTP.
Listener Port	Defina a porta como 5000.

Na página Server Group, configure o parâmetro a seguir e mantenha os demais com seus valores padrão. Em seguida, clique em Next.

Parâmetro	Descrição
Server Group	Selecione o grupo de servidores que você criou.

Na página Confirm, revise as configurações e clique em Submit. Aguarde a criação do listener.

Etapa 4: Configurar a resolução de DNS

Para ambientes de produção, recomenda-se mapear um nome de domínio personalizado para o nome de domínio da instância ALB criando um registro CNAME.

No painel de navegação à esquerda, escolha ALB > Instances.
Na página Instances, copie o nome DNS da instância ALB criada.

Siga estas etapas para adicionar um registro CNAME.

Nota

Se o seu nome de domínio for registrado por um provedor diferente do Alibaba Cloud, adicione o nome de domínio ao console do Alibaba Cloud DNS antes de configurar a resolução de DNS. Para obter mais informações, consulte Gerenciar nomes de domínio. Se o seu nome de domínio for registrado no Alibaba Cloud, prossiga com as etapas a seguir.

Faça login no console do Alibaba Cloud DNS.
Na página Authoritative DNS Resolution, localize o nome de domínio desejado e clique em Settings na coluna Operations.
Na página Settings, clique em Add Record.

No painel Add Record, configure o registro CNAME definindo os parâmetros a seguir e clique em OK.

Parâmetro	Descrição
Record Type	Selecione CNAME na lista suspensa.
Hostname	O prefixo do seu nome de domínio. Este tutorial usa `@`. Nota Para usar um domínio raiz, defina o hostname como `@`.
Query Source	Selecione Default.
Record Value	Insira o nome DNS da instância ALB que você copiou.
TTL	O Time to Live (TTL) é a duração durante a qual um registro DNS fica armazenado em cache em um servidor DNS. Utilize o valor padrão.

Etapa 5: Verificar o resultado

Verifique se o ALB entrega mensagens em tempo real via WebSocket abrindo a aplicação em um navegador em dois computadores distintos e trocando mensagens.

Em um navegador, acesse http://<your-domain-name>:5000 para abrir a aplicação de sala de bate-papo online.

A interface Online Chat Room é carregada. A mensagem "You have entered the chat room!" aparece na área de mensagens do chat, indicando que a conexão WebSocket foi estabelecida. A página contém uma área de configuração de nome de usuário com um botão Set Username e uma área de envio de mensagens com um botão Send.

Se você abrir as ferramentas de desenvolvedor do navegador, a aba Network mostrará que o navegador está se comunicando usando o protocolo WebSocket.

No painel Network, defina o filtro como websocket. Uma requisição WebSocket com código de status 101 indica que o upgrade de protocolo foi bem-sucedido. O status da conexão será Pending, o que significa que a conexão persistente do WebSocket está estabelecida e ativa.
Insira um nome de usuário para o chat e clique em Set Username.
Em cada computador, insira várias mensagens de chat e clique em Send para testar a aplicação.

Ambos os navegadores recebem as mensagens em tempo real.

A aplicação Online Chat Room foi implantada com sucesso. A página contém uma caixa de entrada Username e um botão Set Username, uma área de exibição de mensagens de chat e uma caixa de entrada de mensagens com um botão Send na parte inferior. Vários usuários, como User1 e User2, podem ter uma conversa em tempo real na sala de bate-papo.
Isso confirma que o ALB fornece mensagens em tempo real e com alta disponibilidade via WebSocket.

Perguntas frequentes

Como usar o WebSocket Secure?

O WebSocket Secure é a versão criptografada do protocolo WebSocket.

Os listeners HTTPS suportam o WebSocket Secure por padrão. Para usar o WebSocket Secure, selecione HTTPS ao configurar o listener.

Há cobrança pelo uso do WebSocket?

O WebSocket e o WebSocket Secure não geram cobranças adicionais.

Quais regiões suportam o WebSocket?

Todas as regiões que suportam o ALB também oferecem suporte ao WebSocket e ao WebSocket Secure.

Referências

Este tutorial demonstra a implantação do Redis em uma instância ECS para testes. No entanto, um único servidor Redis representa um potencial ponto único de falha. Para ambientes de produção, recomenda-se o uso do Tair para garantir alta disponibilidade. Para obter mais informações, consulte Início rápido do Tair.