دسترسی به دستگاه های سخت افزاری در وب

API مناسب را برای برقراری ارتباط با دستگاه سخت افزاری انتخابی خود انتخاب کنید.

فرانسوا بوفور
François Beaufort

هدف این راهنما این است که به شما کمک کند بهترین API را برای برقراری ارتباط با یک دستگاه سخت افزاری (مانند وب کم، میکروفون و غیره) در وب انتخاب کنید. منظورم از "بهترین" این است که هر آنچه را که نیاز دارید با کمترین مقدار کار به شما می دهد. به عبارت دیگر، شما می‌دانید مورد استفاده عمومی را که می‌خواهید حل کنید (مثلاً دسترسی به ویدیو) اما نمی‌دانید از چه API استفاده کنید یا نمی‌دانید که آیا راه دیگری برای دستیابی به آن وجود دارد یا خیر.

یکی از مشکلاتی که من معمولاً می بینم توسعه دهندگان وب درگیر آن می شوند، پریدن به API های سطح پایین بدون یادگیری در مورد API های سطح بالاتر است که پیاده سازی آسان تر و ارائه UX بهتری دارند. بنابراین، این راهنما ابتدا با توصیه API های سطح بالاتر شروع می شود، اما در صورتی که تشخیص داده اید که API سطح بالاتر نیازهای شما را برآورده نمی کند، API های سطح پایین تر را نیز ذکر می کند.

🕹 رویدادهای ورودی را از این دستگاه دریافت کنید

سعی کنید به رویدادهای صفحه کلید و اشاره گر گوش دهید. اگر این دستگاه یک کنترلر بازی است، از Gamepad API استفاده کنید تا بدانید کدام دکمه ها فشار داده می شوند و کدام محورها حرکت می کنند.

اگر هیچ یک از این گزینه ها برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

📸 از این دستگاه به صدا و تصویر دسترسی داشته باشید

از MediaDevices.getUserMedia() برای دریافت پخش زنده صوتی و تصویری از این دستگاه استفاده کنید و در مورد ضبط صدا و تصویر بیاموزید. همچنین می توانید حرکت، شیب و بزرگنمایی دوربین و سایر تنظیمات دوربین مانند روشنایی و کنتراست را کنترل کنید و حتی تصاویر ثابت بگیرید . از Web Audio می‌توان برای افزودن جلوه‌ها به صدا، ایجاد تجسم‌های صوتی یا اعمال جلوه‌های فضایی (مانند پاننگ) استفاده کرد. نحوه ایجاد نمایه عملکرد برنامه های صوتی وب در کروم را نیز بررسی کنید.

اگر هیچ یک از این گزینه ها برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🖨 در این دستگاه چاپ کنید

از window.print() برای باز کردن یک گفتگوی مرورگر استفاده کنید که به کاربر اجازه می دهد این دستگاه را به عنوان مقصدی برای چاپ سند فعلی انتخاب کند.

اگر این برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🔐 با این دستگاه احراز هویت کنید

از WebAuthn برای ایجاد یک اعتبار کلید عمومی قوی، تایید شده و دارای محدوده مبدا با این دستگاه امنیتی سخت افزاری برای احراز هویت کاربران استفاده کنید. این دستگاه از استفاده از بلوتوث، NFC و احراز هویت رومینگ USB یا U2F یا FIDO2 - که به عنوان کلیدهای امنیتی نیز شناخته می شود - و همچنین یک تأیید کننده پلت فرم که به کاربران امکان می دهد با اثر انگشت یا قفل صفحه خود احراز هویت کنند، پشتیبانی می کند. ساخت اولین برنامه WebAuthn خود را بررسی کنید.

اگر این دستگاه نوع دیگری از دستگاه امنیتی سخت افزاری است (مثلاً کیف پول رمزنگاری شده)، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🗄 به فایل های این دستگاه دسترسی داشته باشید

از File System Access API برای خواندن و ذخیره تغییرات مستقیم در فایل‌ها و پوشه‌های دستگاه کاربر استفاده کنید. اگر در دسترس نیست، از File API استفاده کنید تا از کاربر بخواهید فایل های محلی را از گفتگوی مرورگر انتخاب کند و سپس محتویات آن فایل ها را بخواند.

اگر هیچ یک از این گزینه ها برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🧲 به سنسورهای این دستگاه دسترسی داشته باشید

از Generic Sensor API برای خواندن مقادیر خام حسگر از حسگرهای حرکت (مانند شتاب‌سنج یا ژیروسکوپ) و حسگرهای محیطی (مانند نور محیط، مغناطیس‌سنج) استفاده کنید. اگر در دسترس نیست، از رویدادهای DeviceMotion و DeviceOrientation برای دسترسی به شتاب سنج، ژیروسکوپ و قطب نما داخلی در دستگاه های تلفن همراه استفاده کنید.

اگر برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🛰 به مختصات GPS در این دستگاه دسترسی داشته باشید

از API مکان جغرافیایی برای دریافت طول و عرض جغرافیایی موقعیت فعلی کاربر در این دستگاه استفاده کنید.

اگر برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

🔋 باتری این دستگاه را بررسی کنید

از Battery API برای دریافت اطلاعات میزبان در مورد میزان شارژ باتری استفاده کنید و در صورت تغییر سطح باتری یا وضعیت شارژ به شما اطلاع داده شود.

اگر برای شما کار نمی کند، یک API سطح پایین ممکن است راه حل باشد. کشف نحوه برقراری ارتباط با دستگاه خود برای شروع سفر را بررسی کنید.

📞 با این دستگاه از طریق شبکه ارتباط برقرار کنید

در شبکه محلی، از Remote Playback API برای پخش صدا و/یا ویدیو بر روی یک دستگاه پخش از راه دور (به عنوان مثال یک تلویزیون هوشمند یا یک بلندگوی بی سیم) استفاده کنید یا از API Presentation برای ارائه یک صفحه وب در صفحه دوم (به عنوان مثال یک صفحه ثانویه) استفاده کنید. صفحه نمایش متصل به کابل HDMI یا تلویزیون هوشمند متصل به بی سیم).

اگر این دستگاه یک وب سرور را در معرض دید قرار داد، از Fetch API و/یا WebSockets برای واکشی برخی از داده ها از این دستگاه با ضربه زدن به نقاط پایانی مناسب استفاده کنید. در حالی که سوکت های TCP و UDP در وب در دسترس نیستند، WebTransport را بررسی کنید تا اتصالات شبکه تعاملی، دوطرفه و چندگانه را مدیریت کنید. توجه داشته باشید که WebRTC همچنین می تواند برای برقراری ارتباط بلادرنگ داده ها با سایر مرورگرها با استفاده از پروتکل همتا به همتا استفاده شود.

🧱 نحوه برقراری ارتباط با دستگاه خود را کشف کنید

تصمیم در مورد اینکه از چه API سطح پایینی باید استفاده کنید با توجه به ماهیت اتصال فیزیکی شما به دستگاه تعیین می شود. اگر بی سیم است، Web NFC را برای اتصالات بی سیم با برد بسیار کوتاه و Web Bluetooth یا Web Serial را برای دستگاه های بی سیم اطراف بررسی کنید.

  • با Web NFC ، وقتی این دستگاه در مجاورت دستگاه کاربر است (معمولاً 5 تا 10 سانتی متر، 2 تا 4 اینچ) آن را بخوانید و بنویسید. ابزارهایی مانند NFC TagInfo توسط NXP به شما امکان می دهد محتوای این دستگاه را برای اهداف مهندسی معکوس مرور کنید.

  • با بلوتوث وب ، از طریق اتصال کم مصرف بلوتوث به این دستگاه متصل شوید. هنگامی که از خدمات استاندارد گات بلوتوث (مانند سرویس باتری) استفاده می کند، ارتباط با آن بسیار آسان است زیرا رفتار آنها به خوبی مستند شده است. اگر نه، در این مرحله، یا باید اسناد سخت افزاری این دستگاه را پیدا کنید یا آن را مهندسی معکوس کنید. برای این کار می‌توانید از ابزارهای خارجی مانند nRF Connect for Mobile و ابزارهای داخلی مرورگر مانند صفحه داخلی about://bluetooth-internals در مرورگرهای مبتنی بر Chromium استفاده کنید. مهندسی معکوس یک لامپ بلوتوث از Uri Shaked را بررسی کنید. توجه داشته باشید که دستگاه های بلوتوث نیز ممکن است پروتکل های HID یا سریال را صدا کنند.

  • با سریال از طریق بلوتوث ، با سرویس‌های RFCOMM در دستگاه‌های کلاسیک بلوتوث جفت شده مانند نمایه پورت سریال استاندارد (SPP) ارتباط برقرار کنید. با این حال، برای خدمات سفارشی مبتنی بر RFCOMM، باید با اسناد فروشنده دستگاه مشورت کنید تا سرویس UUID به requestPort() منتقل شود.

اگر سیمی است، این APIها را به ترتیب خاص بررسی کنید:

  1. با WebHID ، درک گزارش های HID و توصیفگرهای گزارش از طریق مجموعه ها کلید درک شما از این دستگاه است. این می تواند بدون مستندات فروشنده برای این دستگاه چالش برانگیز باشد. ابزارهایی مانند Wireshark می توانند به شما در مهندسی معکوس کمک کنند. همچنین می‌توانید از برنامه وب HID Explorer برای ریختن اطلاعات دستگاه‌های HID در قالبی قابل خواندن برای انسان استفاده کنید.

  2. با سریال وب ، بدون مستندات فروشنده برای این دستگاه و دستوراتی که این دستگاه پشتیبانی می‌کند، این کار سخت است اما با حدس زدن خوش شانس هنوز امکان‌پذیر است. مهندسی معکوس این دستگاه را می توان با گرفتن ترافیک خام USB با ابزارهایی مانند Wireshark انجام داد. همچنین می‌توانید از برنامه وب Serial Terminal برای آزمایش با این دستگاه در صورت استفاده از پروتکل قابل خواندن توسط انسان استفاده کنید.

  3. با WebUSB ، بدون مستندات واضح برای این دستگاه و دستورات USB که این دستگاه پشتیبانی می‌کند، سخت است، اما با حدس زدن خوش شانس هنوز ممکن است. Exploring WebUSB و پتانسیل هیجان انگیز آن را از سوز هینتون تماشا کنید. همچنین می‌توانید با گرفتن ترافیک خام USB و بازرسی توصیفگرهای USB با ابزارهای خارجی مانند Wireshark و ابزارهای داخلی مرورگر مانند صفحه داخلی about://usb-internals در مرورگرهای مبتنی بر Chromium، این دستگاه را مهندسی معکوس کنید.

قدردانی

با تشکر از ریلی گرانت ، توماس اشتاینر ، و کیس باسک برای بررسی این مقاله.

عکس از دریا تریفاناوا در Unsplash .