Ferramenta de túnel local do Azure Web PubSub

O túnel local Web PubSub fornece um ambiente de desenvolvimento local para que os clientes aprimorem sua experiência de desenvolvimento local. Não há mais necessidade de usar ferramentas de terceiros para expor portas locais, use o túnel local Web PubSub como o túnel entre o serviço Web PubSub e seu servidor local para manter seu ambiente de desenvolvimento local seguro e protegido.

O túnel local Web PubSub fornece:

  • Uma maneira de encapsular o tráfego do Web PubSub para o seu servidor local
  • Uma maneira de visualizar o fluxo de dados de ponta a ponta do seu cliente para o Web PubSub através do túnel e para o seu servidor local
  • Fornece um servidor upstream incorporado para você começar
  • Fornece um cliente simples para você começar com o desenvolvimento do seu servidor

Benefícios:

  • Local seguro: não há necessidade de expor seu servidor local ao público
  • Conexão segura: use a ID do Microsoft Entra e a política de acesso Web PubSub para se conectar
  • Configuração simples: modelo de URL definido como tunnel:///<your_server_path>
  • Inspeção de dados: visão vívida dos dados e do fluxo de trabalho

Pré-requisito

  • Node.js versão 16 ou superior

Instalar

npm install -g @azure/web-pubsub-tunnel-tool

Utilização

Usage: awps-tunnel [options] [command]

A local tool to help tunnel Azure Web PubSub traffic to local web app and provide a vivid view to the end to end workflow.

Options:
  -v, --version   Show the version number.
  -h, --help      Show help details.

Commands:
  status          Show the current configuration status.
  bind [options]  Bind configurations to the tool so that you don't need to specify them every time running the tool.
  run [options]   Run the tool.
  help [command]  Display help details for subcommand.

You could also set WebPubSubConnectionString environment variable if you don't want to configure endpoint.

Preparar a credencial

A cadeia de conexão e a ID do Microsoft Entra são suportadas.

Usando a cadeia de conexão

  1. No portal de serviço Web PubSub, copie a cadeia de conexão do portal de serviço Web PubSub.

  2. Defina a cadeia de conexão para a variável de ambiente local e inicie awps-tunnelo .

export WebPubSubConnectionString="<your connection string>"

Usando o Azure Identity

  1. No portal de serviço Web PubSub, vá para a guia Controle de acesso e adicione função Web PubSub Service Owner à sua identidade.

  2. Em seu terminal local, use a CLI az login do Azure para entrar em sua identidade.

  3. Como alternativa, você pode definir informações de conta por meio de variáveis de ambiente definidas ou usar a autenticação de identidade gerenciada diretamente para serviços do Azure com suporte.

Executar

  1. No portal de serviço Web PubSub, vá para a guia Configurações, especifique o modelo de URL do manipulador de eventos com tunnel:/// o qual começar para permitir a conexão de túnel.

    Captura de ecrã a mostrar a configuração do URL upstream nas definições do hub.

  2. Execute a ferramenta com o hub definido antes, por exemplo, conectar-se a um ponto de extremidade https://<awps-host-name>.webpubsub.azure.com com hub chat:

    awps-tunnel run --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com
    

    Você também pode usar awps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com para salvar a configuração e, em seguida, awps-tunnel run.

  3. Você vê a saída como Open webview at: http://127.0.0.1:4000, abra o link em seu navegador e poderá ver o status do túnel e o fluxo de trabalho.

  4. Agora mude para a guia Servidor e marque Built-in Echo Server para iniciar um servidor upstream integrado com código semelhante ao código de exemplo mostrado abaixo dele.

    Screenshot do início do servidor de eco incorporado.

  5. Como alternativa, você pode iniciar seu próprio servidor upstream em http://localhost:3000. Você também pode especificar a opção--upstream http://localhost:<custom-port> quando awps-tunnel run ou awps-tunnel bind para configurar seu próprio servidor upstream em uma porta personalizada. Por exemplo, execute o código abaixo para iniciar este servidor upstream de exemplo, quando ele for iniciado, o upstream atende solicitações parahttp://localhost:3000/eventhandler/.

    git clone https://github.com/Azure/azure-webpubsub.git
    cd tools/awps-tunnel/server/samples/upstream
    npm install
    npm start
    
  6. Agora alterne para a guia Cliente , selecione Connect para iniciar uma conexão WebSocket de teste com o serviço Azure Web PubSub. Você veria que o tráfego passa pelo Web PubSub para o Túnel Local e, finalmente, chega ao servidor upstream. A guia do túnel fornece os detalhes da solicitação e das respostas, fornecendo uma visão vívida do que está solicitando seu servidor upstream e o que está reponding do servidor upstream.

    Captura de tela de iniciar a conexão WebSocket de teste e enviar mensagem.

    Captura de tela mostrando a inspeção de tráfego.

Under the hood (Como funciona o Azure RMS? Nos bastidores)

Como funciona a ferramenta de túnel? Sob o capô, ele inicia uma conexão de túnel com o serviço Web PubSub. A conexão de túnel é uma conexão persistente (WebSocket) que se conecta /server/tunnel ao ponto de extremidade e é considerada como um tipo de conexão de servidor. Você também pode usar regras de ACL no serviço para desabilitar a conexão dessas conexões.