Condividi tramite


Strumento di tunnel locale PubSub di Azure

Il tunnel locale Web PubSub offre ai clienti un ambiente di sviluppo locale per migliorare l'esperienza di sviluppo locale. Non è più necessario usare strumenti di terze parti per esporre le porte locali, usare il tunnel locale Di PubSub Web come tunnel tra il servizio Web PubSub e il server locale per proteggere e proteggere l'ambiente di sviluppo locale.

Web PubSub tunnel locale fornisce:

  • Un modo per eseguire il tunneling del traffico da Web PubSub al server locale
  • Un modo per visualizzare il flusso di dati end-to-end dal client a Web PubSub attraverso il tunnel e il server locale
  • Fornisce un server upstream incorporato per iniziare
  • Fornisce un semplice client per iniziare a usare lo sviluppo di server

Vantaggi:

  • Locale protetto: non è necessario esporre il server locale al pubblico
  • Connessione protetta: usare i criteri di accesso Microsoft Entra ID e Web PubSub per connettersi
  • Configurazione semplice: set di modelli di URL su tunnel:///<your_server_path>
  • Ispezione dei dati: visualizzazione vivida dei dati e del flusso di lavoro

Prerequisito

  • Node.js versione 16 o successiva

Installazione

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

Utilizzo

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.

Preparare le credenziali

Sono supportati sia stringa di connessione che Microsoft Entra ID.

Uso di stringa di connessione

  1. Nel portale del servizio Web PubSub copiare il stringa di connessione dal portale del servizio Web PubSub.

  2. Impostare il stringa di connessione sulla variabile di ambiente locale e avviare awps-tunnel.

export WebPubSubConnectionString="<your connection string>"

Uso dell'identità di Azure

  1. Nel portale del servizio Web PubSub passare alla scheda Controllo di accesso e aggiungere il ruolo Web PubSub Service Owner all'identità.

  2. Nel terminale locale usare l'interfaccia della riga di comando az login di Azure per accedere all'identità.

  3. In alternativa, è possibile impostare le informazioni sull'account tramite variabili di ambiente definite o usare l'autenticazione dell'identità gestita direttamente per i servizi di Azure supportati.

Run

  1. Nel portale del servizio Web PubSub passare alla scheda Impostazioni, specificare il modello di URL del gestore eventi con cui iniziare tunnel:/// per consentire la connessione al tunnel.

    Screenshot dell'impostazione dell'URL upstream nelle impostazioni dell'hub.

  2. Eseguire lo strumento con l'hub impostato prima, ad esempio connettersi a un endpoint https://<awps-host-name>.webpubsub.azure.com con l'hub chat:

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

    È anche possibile usare awps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com per salvare la configurazione e quindi awps-tunnel run.

  3. Viene visualizzato l'output, ad Open webview at: http://127.0.0.1:4000esempio , aprire il collegamento nel browser e visualizzare lo stato del tunnel e il flusso di lavoro.

  4. Passare ora alla scheda Server e selezionare Server Echo predefinito per avviare un server upstream predefinito con codice simile al codice di esempio illustrato di seguito.

    Screenshot dell'avvio del server echo predefinito.

  5. In alternativa, è possibile avviare il proprio server upstream all'indirizzo http://localhost:3000. È anche possibile specificare l'opzione--upstream http://localhost:<custom-port> quando awps-tunnel run o awps-tunnel bind per configurare il proprio server upstream in una porta personalizzata. Ad esempio, eseguire il codice seguente per avviare questo server upstream di esempio, all'avvio, l'upstream gestisce le richieste a http://localhost:3000/eventhandler/.

    git clone https://github.com/Azure/azure-webpubsub.git
    cd tools/awps-tunnel/server/samples/upstream
    npm install
    npm start
    
  6. Passare ora alla scheda Client , selezionare Connect per avviare una connessione WebSocket di test al servizio Web PubSub di Azure. Si noterà che il traffico passa attraverso Web PubSub al tunnel locale e infine raggiunge il server upstream. La scheda tunnel fornisce i dettagli della richiesta e delle risposte, fornendo una visualizzazione vivida di ciò che richiede il server upstream e delle risposte dal server upstream.

    Screenshot dell'avvio della connessione WebSocket di test e dell'invio del messaggio.

    Screenshot che mostra l'ispezione del traffico.

Informazioni dettagliate

Come funziona lo strumento tunnel? Sotto le quinte avvia una connessione tunnel al servizio Web PubSub. La connessione tunnel è una connessione permanente (WebSocket) si connette all'endpoint /server/tunnel e viene considerata come un tipo di connessioni server. È anche possibile usare le regole ACL nel servizio per disabilitare tali connessioni dalla connessione.