Delen via


Azure Web PubSub-hulpprogramma voor lokale tunnel

Web PubSub lokale tunnel biedt een lokale ontwikkelomgeving voor klanten om hun lokale ontwikkelervaring te verbeteren. Het is niet nodig om hulpprogramma's van derden te gebruiken om lokale poorten beschikbaar te maken, gebruik de lokale Tunnel van Web PubSub als de tunnel tussen de Web PubSub-service en uw lokale server om uw lokale ontwikkelomgeving veilig en veilig te houden.

De lokale Web PubSub-tunnel biedt:

  • Een manier om verkeer van Web PubSub naar uw lokale server te tunnelen
  • Een manier om de end-to-end gegevensstroom van uw client naar Web PubSub via de tunnel en naar uw lokale server weer te geven
  • Biedt een ingesloten upstream-server om aan de slag te gaan
  • Biedt een eenvoudige client waarmee u aan de slag kunt met uw serverontwikkeling

Voordelen:

  • Beveiligd lokaal: u hoeft uw lokale server niet beschikbaar te maken voor openbaar
  • Beveiligde verbinding: gebruik Microsoft Entra ID en web PubSub-toegangsbeleid om verbinding te maken
  • Eenvoudige configuratie: URL-sjabloonsets op tunnel:///<your_server_path>
  • Gegevensinspectie: levendige weergave van de gegevens en de werkstroom

Vereiste

  • Node.js versie 16 of hoger

Installeren

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

Gebruik

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.

De referentie voorbereiden

Zowel verbindingsreeks als Microsoft Entra-id worden ondersteund.

Verbindingsreeks gebruiken

  1. Kopieer uw verbindingsreeks vanuit uw Web PubSub-serviceportal in uw Web PubSub-serviceportal.

  2. Stel de verbindingsreeks in op uw lokale omgevingsvariabele en start awps-tunnel.

export WebPubSubConnectionString="<your connection string>"

Azure Identity gebruiken

  1. Ga in uw Web PubSub-serviceportal naar het tabblad Toegangsbeheer en voeg een rol Web PubSub Service Owner toe aan uw identiteit.

  2. Gebruik Azure CLI az login in uw lokale terminal om u aan te melden bij uw identiteit.

  3. U kunt ook accountgegevens instellen via gedefinieerde omgevingsvariabelen of beheerde identiteitsverificatie rechtstreeks gebruiken voor ondersteunde Azure-services.

Uitvoeren

  1. Ga in de portal van de Web PubSub-service naar het tabblad Instellingen, geef de URL-sjabloon voor de gebeurtenishandler op waarmee u wilt beginnen tunnel:/// om tunnelverbinding toe te staan.

    Schermopname van het instellen van de upstream-URL in hubinstellingen.

  2. Voer het hulpprogramma uit met de hub die u eerder hebt ingesteld, bijvoorbeeld om verbinding te maken met een eindpunt https://<awps-host-name>.webpubsub.azure.com met de hub chat:

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

    U kunt ook de awps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com configuratie opslaan en vervolgens awps-tunnel run.

  3. U ziet uitvoer zoals Open webview at: http://127.0.0.1:4000, open de koppeling in uw browser en u kunt de tunnelstatus en de werkstroom zien.

  4. Schakel nu over naar het tabblad Server en controleer ingebouwde echoserver om een ingebouwde upstream-server te starten met code die vergelijkbaar is met de voorbeeldcode die eronder wordt weergegeven.

    Schermopname van het starten van een ingebouwde echoserver.

  5. U kunt ook uw eigen upstream-server starten op http://localhost:3000. U kunt ook de optie--upstream http://localhost:<custom-port> opgeven wanneer awps-tunnel run of awps-tunnel bind om uw eigen upstream-server te configureren op een aangepaste poort. Voer bijvoorbeeld de onderstaande code uit om deze upstream-voorbeeldserver te starten, wanneer deze wordt gestart, de upstream aanvragen naarhttp://localhost:3000/eventhandler/.

    git clone https://github.com/Azure/azure-webpubsub.git
    cd tools/awps-tunnel/server/samples/upstream
    npm install
    npm start
    
  6. Schakel nu over naar het tabblad Client en selecteer Connect om een test-WebSocket-verbinding met de Azure Web PubSub-service te starten. U ziet dat het verkeer via Web PubSub naar de lokale tunnel gaat en uiteindelijk de upstream-server bereikt. Het tabblad Tunnel bevat de details van de aanvraag en antwoorden, zodat u een levendig beeld krijgt van wat uw upstream-server aanvraagt en wat er reageert vanaf de upstream-server.

    Schermopname van het starten van de Test WebSocket-verbinding en het verzenden van een bericht.

    Schermopname van het weergeven van de verkeersinspectie.

Onder de motorkap

Hoe werkt het tunnelhulpprogramma? Onder de schermen wordt een tunnelverbinding met de Web PubSub-service gestart. Tunnelverbinding is een permanente verbinding (WebSocket) die verbinding maakt met het /server/tunnel eindpunt en wordt beschouwd als een soort serververbindingen. U kunt ook ACL-regels in de service gebruiken om dergelijke verbindingen uit te schakelen.