Azure Web PubSub yerel tünel aracı

Web PubSub yerel tüneli, müşterilerin yerel geliştirme deneyimlerini geliştirmeleri için yerel bir geliştirme ortamı sağlar. Artık yerel bağlantı noktalarını kullanıma açmak için üçüncü taraf araçları kullanmanıza gerek yoktur; yerel geliştirme ortamınızı güvenli ve güvenli tutmak için Web PubSub hizmetiyle yerel sunucunuz arasındaki tünel olarak Web PubSub yerel tünelini kullanın.

Web PubSub yerel tüneli şu bilgileri sağlar:

  • Web PubSub'dan yerel sunucunuza trafik tüneli oluşturmanın bir yolu
  • İstemcinizden Web PubSub'a tünel üzerinden ve yerel sunucunuza uçtan uca veri akışını görüntülemenin bir yolu
  • Kullanmaya başlamanız için ekli bir yukarı akış sunucusu sağlar
  • Sunucu geliştirmenize başlamanız için basit bir istemci sağlar

Avantajlar:

  • Güvenli yerel: Yerel sunucunuzu genel kullanıma sunmanıza gerek yoktur
  • Güvenli bağlantı: Bağlanmak için Microsoft Entra Id ve Web PubSub erişim ilkesini kullanın
  • Basit yapılandırma: URL şablon kümeleri: tunnel:///<your_server_path>
  • Veri denetimi: Verilerin ve iş akışının canlı görünümü

Önkoşul

  • Node.js sürüm 16 veya üzeri

Yükleme

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

Kullanım

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.

Kimlik bilgilerini hazırlama

Hem bağlantı dizesi hem de Microsoft Entra Id desteklenir.

bağlantı dizesi kullanma

  1. Web PubSub hizmet portalınızda, Web PubSub hizmet portalınızdan bağlantı dizesi kopyalayın.

  2. bağlantı dizesi yerel ortam değişkeninize ayarlayın ve başlatınawps-tunnel.

export WebPubSubConnectionString="<your connection string>"

Azure Kimliğini Kullanma

  1. Web PubSub hizmet portalınızda Erişim denetimi sekmesine gidin ve kimliğinize rol Web PubSub Service Owner ekleyin.

  2. Yerel terminalinizde, kimliğinizde oturum açmak için Azure CLI'yi az login kullanın.

  3. Alternatif olarak, tanımlı ortam değişkenleri aracılığıyla hesap bilgilerini ayarlayabilir veya yönetilen kimlik kimlik doğrulamasını doğrudan desteklenen Azure hizmetleri için kullanabilirsiniz.

Çalıştır

  1. Web PubSub hizmet portalınızda Ayarlar sekmesine gidin, tünel bağlantısına izin vermek için başlangıç olarak kullanılacak tunnel:/// olay işleyiciSI URL şablonunu belirtin.

    Hub ayarlarında yukarı akış URL'sini ayarlama işleminin ekran görüntüsü.

  2. Aracı daha önce ayarladığınız hub ile çalıştırın; örneğin, hub chatile bir uç noktaya https://<awps-host-name>.webpubsub.azure.com bağlanın:

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

    Yapılandırmayı ve ardından awps-tunnel run'yi kaydetmek için de kullanabilirsinizawps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com.

  3. gibi Open webview at: http://127.0.0.1:4000bir çıktı görürsünüz, bağlantıyı tarayıcınızda açarsınız ve tünel durumunu ve iş akışını görebilirsiniz.

  4. Şimdi Sunucu sekmesine geçin ve yerleşik Echo Sunucusu'nu denetleerek aşağıda gösterilen örnek koda benzer bir kodla yerleşik bir yukarı akış sunucusu başlatın.

    Yerleşik yankı sunucusunu başlatmanın ekran görüntüsü.

  5. Alternatif olarak, kendi yukarı akış sunucunuzu şu konumdan başlatabilirsiniz: http://localhost:3000. Özel bir bağlantı noktasında kendi yukarı akış sunucunuzu ne zaman veya awps-tunnel bind ne zaman awps-tunnel run yapılandırabileceğinizi--upstream http://localhost:<custom-port> de belirtebilirsiniz. Örneğin, bu örnek yukarı akış sunucusunu başlatmak için aşağıdaki kodu çalıştırın; başlatıldığında, yukarı akış şu isteklere hizmet eder: 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. Şimdi İstemci sekmesine geçin, Azure Web PubSub hizmetine test WebSocket bağlantısı başlatmak için seçinConnect. Trafiğin Web PubSub üzerinden Yerel Tünel'e gittiğini ve son olarak yukarı akış sunucusuna ulaştığını görürsünüz. Tünel sekmesi, isteğin ve yanıtların ayrıntılarını sağlayarak yukarı akış sunucunuzu nelerin istediğini ve yukarı akış sunucusundan nelerin depolandığından canlı bir görünüm sağlar.

    Test WebSocket bağlantısını başlatma ve ileti gönderme işleminin ekran görüntüsü.

    Trafik incelemesini gösteren ekran görüntüsü.

Temel bileşenler

Tünel aracı nasıl çalışır? Arka planda Web PubSub hizmetine bir tünel bağlantısı başlatır. Tünel bağlantısı, uç noktaya bağlanan /server/tunnel kalıcı bir bağlantıdır (WebSocket) ve bir tür sunucu bağlantısı olarak kabul edilir. Bu tür bağlantıların bağlanmasını devre dışı bırakmak için hizmetteki ACL kurallarını da kullanabilirsiniz.