مشاركة عبر

أداة النفق المحلي Azure Web PubSub

  • مقالة

يوفر نفق Web PubSub المحلي بيئة تطوير محلية للعملاء لتعزيز تجربة التطوير المحلية الخاصة بهم. ليست هناك حاجة لاستخدام أدوات الجهات الخارجية لعرض المنافذ المحلية بعد الآن، واستخدام نفق Web PubSub المحلي كنفق بين خدمة Web PubSub والخادم المحلي للحفاظ على بيئة التطوير المحلية آمنة وآمنة.

يوفر نفق Web PubSub المحلي ما يلي:

  • طريقة لحركة مرور النفق من Web PubSub إلى الخادم المحلي
  • طريقة لعرض تدفق البيانات من طرف إلى طرف من عميلك إلى Web PubSub عبر النفق وإلى الخادم المحلي
  • يوفر خادما مضمنا للمصدر للبدء
  • يوفر عميلا بسيطا لك للبدء في تطوير الخادم الخاص بك

المزايا:

  • محلي آمن: لا حاجة لعرض الخادم المحلي للجمهور
  • اتصال آمن: استخدم معرف Microsoft Entra ونهج الوصول إلى Web PubSub للاتصال
  • تكوين بسيط: يتم تعيين قالب URL إلى tunnel:///<your_server_path>
  • فحص البيانات: عرض حي للبيانات وسير العمل

المتطلب الأساسي

  • Node.js الإصدار 16 أو أعلى

تثبيت

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

الاستخدام

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.

إعداد بيانات الاعتماد

يتم دعم كل من سلسلة الاتصال ومعرف Microsoft Entra.

استخدام سلسلة الاتصال

  1. في مدخل خدمة Web PubSub، انسخ سلسلة الاتصال من مدخل خدمة Web PubSub.

  2. قم بتعيين سلسلة الاتصال إلى متغير البيئة المحلية وابدأ awps-tunnel.

export WebPubSubConnectionString="<your connection string>"

استخدام هوية Azure

  1. في مدخل خدمة Web PubSub، انتقل إلى علامة التبويب Access control، وأضف دورا Web PubSub Service Owner إلى هويتك.

  2. في المحطة الطرفية المحلية، استخدم Azure CLIaz login لتسجيل الدخول إلى هويتك.

  3. بدلا من ذلك، يمكنك تعيين معلومات الحساب عبر متغيرات البيئة المحددة، أو استخدام مصادقة الهوية المدارة مباشرة لخدمات Azure المدعومة.

تشغيل

  1. في مدخل خدمة Web PubSub، انتقل إلى علامة التبويب Settings، وحدد قالب URL لمعالج الأحداث للبدء به tunnel:/// للسماح باتصال النفق.

    لقطة شاشة لإعداد عنوان URL المصدر في إعدادات المركز.

  2. قم بتشغيل الأداة باستخدام المركز الذي قمت بتعيينه من قبل، على سبيل المثال، الاتصال بنقطة https://<awps-host-name>.webpubsub.azure.com نهاية باستخدام المركز chat:

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

    يمكنك أيضا استخدام awps-tunnel bind --hub chat --endpoint https://<awps-host-name>.webpubsub.azure.com لحفظ التكوين ثم awps-tunnel run.

  3. ترى الإخراج مثل Open webview at: http://127.0.0.1:4000، افتح الارتباط في المستعرض الخاص بك ويمكنك رؤية حالة النفق وسير العمل.

  4. الآن قم بالتبديل إلى علامة التبويب Server ، وتحقق من خادم Echo المضمن لبدء تشغيل خادم منبع مضمن مع تعليمات برمجية مشابهة لعينة التعليمات البرمجية الموضحة أدناه.

    لقطة شاشة لبدء تشغيل خادم echo المضمن.

  5. بدلا من ذلك، يمكنك بدء تشغيل خادم المصدر الخاص بك في http://localhost:3000. يمكنك أيضا تحديد خيار--upstream http://localhost:<custom-port> متى awps-tunnel run أو awps-tunnel bind لتكوين خادم المصدر الخاص بك في منفذ مخصص. على سبيل المثال، قم بتشغيل التعليمات البرمجية أدناه لبدء تشغيل خادم المصدر النموذجي هذا، عند بدء تشغيله، يخدم المصدر الطلبات إلى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. الآن قم بالتبديل إلى علامة التبويب Client ، وحدد Connect لبدء اختبار اتصال WebSocket إلى خدمة Azure Web PubSub. سترى حركة المرور تمر عبر Web PubSub إلى النفق المحلي وأخيرا تصل إلى الخادم المصدر. توفر علامة تبويب النفق تفاصيل الطلب والاستجابات، ما يوفر لك عرضا حيا لما يطلب الخادم المصدر وما يستجيب من الخادم المصدر.

    لقطة شاشة لبدء اختبار اتصال WebSocket وإرسال الرسالة.

    لقطة شاشة توضح فحص حركة المرور.

في الخلفية

كيف تعمل أداة النفق؟ تحت الغطاء يبدأ اتصال نفق بخدمة Web PubSub. اتصال النفق هو اتصال مستمر (WebSocket) يتصل بنقطة /server/tunnel النهاية، ويعتبر نوعا واحدا من اتصالات الخادم. يمكنك أيضا استخدام قواعد ACL في الخدمة لتعطيل مثل هذه الاتصالات من الاتصال.