Outil de tunnel local Azure Web PubSub

Article
03/06/2024

Le tunnel local Web PubSub fournit un environnement de développement local pour permettre aux clients d’améliorer leur expérience de développement local. Vous n’avez plus besoin d’utiliser des outils tiers pour exposer les ports locaux, utilisez le tunnel local Web PubSub comme tunnel entre le service Web PubSub et votre serveur local pour assurer la sécurité de votre environnement de développement local.

Le tunnel local Azure Web PubSub fournit :

Un moyen de tunneliser le trafic de Web PubSub vers votre serveur local
Un moyen de voir le flux de données de bout en bout de votre client vers Web PubSub dans le tunnel et vers votre serveur local
Fournit un serveur en amont incorporé pour vous permettre de bien démarrer
Fournit un client simple pour vous permettre de bien démarrer avec le développement de votre serveur

Avantages :

Local sécurisé : inutile d’exposer votre serveur local au public
Connexion sécurisée : utilisez Microsoft Entra ID et la stratégie d’accès Web PubSub pour vous connecter
Configuration simple : ensembles de modèles d’URL sur tunnel:///<your_server_path>
Inspection des données : vue claire des données et du workflow

Prérequis

Node.js version 16 ou ultérieure

Installer

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

Usage

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.

Préparer les informations d’identification

La chaîne de connexion et Microsoft Entra ID sont pris en charge.

Utilisation d’une chaîne de connexion

Dans le portail du service Web PubSub, copiez votre chaîne de connexion à partir du portail du service Web PubSub.
Définissez la chaîne de connexion sur votre variable d’environnement locale et démarrez awps-tunnel.

Linux ou macOS
Windows

export WebPubSubConnectionString="<your connection string>"

SET WebPubSubConnectionString=<your connection string>

Utilisation de l’identité Azure

Dans le portail du service Web PubSub, accédez à l’onglet Contrôle d’accès et ajoutez le rôle Web PubSub Service Owner à votre identité.
Dans votre terminal local, utilisez Azure CLI az login pour vous connecter à votre identité.
Vous pouvez également définir des informations de compte avec des variables d’environnement définies ou utiliser l’authentification par identité managée directement pour les services Azure pris en charge.

Exécuter

Dans le portail du service Web PubSub, accédez à l’onglet Paramètres, spécifiez le modèle d’URL du gestionnaire d’événements pour commencer avec tunnel:/// afin d’autoriser la connexion de tunnel.
Exécutez l’outil avec le hub que vous avez défini auparavant, par exemple, connectez-vous à un point de terminaison https://<awps-host-name>.webpubsub.azure.com avec le hub chat :
```
awps-tunnel run --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com
```
Vous pouvez également utiliser awps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com pour enregistrer la configuration, puis awps-tunnel run.
Vous voyez une sortie de type Open webview at: http://127.0.0.1:4000, ouvrez le lien dans votre navigateur pour voir l’état du tunnel et le workflow.
Passez maintenant à l’onglet Serveur, puis vérifiez Serveur Echo intégré pour démarrer un serveur en amont intégré avec du code similaire à l’exemple de code indiqué ci-dessous.
Vous pouvez également démarrer votre propre serveur en amont sur http://localhost:3000. Vous pouvez également spécifier l’option--upstream http://localhost:<custom-port> avec awps-tunnel run ou awps-tunnel bind pour configurer votre propre serveur en amont sur un port personnalisé. Par exemple, exécutez le code ci-dessous pour démarrer cet exemple de serveur en amont, au démarrage, le serveur en amont sert les demandes à http://localhost:3000/eventhandler/.
```
git clone https://github.com/Azure/azure-webpubsub.git
cd tools/awps-tunnel/server/samples/upstream
npm install
npm start
```
Basculez maintenant vers l'onglet Client, sélectionnez Connect pour démarrer une connexion WebSocket de test au service Azure Web PubSub. Vous voyez que le trafic traverse Web PubSub vers le tunnel local pour atteindre le serveur en amont. L’onglet du tunnel fournit les détails de la demande et des réponses, ce qui vous donne une vue claire de ce que demande votre serveur en amont et de ce qu’il fournit comme réponses.

Sous le capot

Comment fonctionne l’outil de tunnel ? En coulisses, il démarre une connexion de tunnel au service Web PubSub. La connexion de tunnel est une connexion persistante (WebSocket) qui se connecte au point de terminaison /server/tunnel. Elle est considérée comme un type de connexions serveur. Vous pouvez également utiliser des règles ACL dans le service pour désactiver ce type de connexions.

Partager via