Esirakenduse WebHID-seadme filter: inimliideseseadmete valiku selgitus

WebHID API avab veebirakenduste jaoks terve võimaluste maailma, lubades neil suhelda otse inimliideseseadmetega (HID), nagu mängupuldid, spetsialiseeritud sisendseadmed ja palju muud. WebHID-i tõhusaks kasutamiseks on oluline mõista seadmefiltreid. See põhjalik juhend tutvustab teile WebHID-seadmefiltrite olemust, andes teile võimaluse luua võimsaid ja kaasahaaravaid veebikogemusi.

Mis on WebHID?

WebHID on veebi API, mis võimaldab veebirakendustel suhelda kasutaja arvuti või mobiilseadmega ühendatud HID-seadmetega. Erinevalt traditsioonilistest veebi API-dest, mis tuginevad konkreetsetele seadmedraiveritele, pakub WebHID üldist liidest laia valiku seadmetega suhtlemiseks, eeldusel, et kasutaja annab selleks loa. See muudab selle ideaalseks seadmetele, millel puudub brauseri omatugi või mis nõuavad kohandatud sisendi käsitlemist.

Miks kasutada WebHID-i?

• Otsene juurdepääs seadmele: Suhelge otse HID-seadmetega, ilma et peaksite tuginema brauserispetsiifilistele draiveritele.
• Kohandatud sisendi käsitlemine: Rakendage kohandatud sisendi kaardistamist ja töötlemist spetsialiseeritud seadmete jaoks.
• Laialdane seadmete tugi: Toetage laiemat valikut seadmeid, sealhulgas mängupulte, teaduslikke instrumente ja tööstuslikke kontrollereid.
• Parem kasutajakogemus: Looge kaasahaaravamaid ja interaktiivsemaid veebikogemusi.

WebHID-seadmefiltrite mõistmine

Seadmefiltrid on konkreetsetele HID-seadmetele juurdepääsu taotlemisel üliolulised. Kui teie veebirakendus kutsub välja navigator.hid.requestDevice(), kuvab brauser seadmevalija, mis võimaldab kasutajal seadme valida. Seadmefiltrid võimaldavad teil kitsendada kasutajale esitatavate seadmete loendit, muutes neil õige seadme leidmise lihtsamaks.

Seadmefilter on JavaScripti objekt, mis määrab kriteeriumid HID-seadmete sobitamiseks. Saate requestDevice() kutses määrata mitu filtrit ja brauser kuvab ainult seadmeid, mis vastavad vähemalt ühele neist filtritest.

Seadmefiltri omadused

• vendorId (valikuline): Seadme USB tootja ID (Vendor ID). See on 16-bitine number, mis tuvastab seadme tootja.
• productId (valikuline): Seadme USB toote ID (Product ID). See on 16-bitine number, mis tuvastab seadme konkreetse mudeli.
• usagePage (valikuline): Seadme HID kasutusleht (Usage Page). See tuvastab seadme kategooria (nt üldised töölauakontrollid, mängukontrollid).
• usage (valikuline): Seadme HID kasutus (Usage). See tuvastab seadme konkreetse funktsiooni kasutuslehe piires (nt juhtkang, mängupult).

Nende omaduste kombinatsiooni abil saate luua väga spetsiifilisi filtreid. Näiteks võite filtreerida seadmeid kindla vendorId ja productId abil, et sihtida teatud mängupuldi mudelit.

Seadmefiltrite praktilised näited

Vaatame mõningaid praktilisi näiteid, kuidas seadmefiltreid oma veebirakendustes kasutada.

Näide 1: Konkreetse mängupuldi filtreerimine

Oletame, et soovite sihtida konkreetset mängupulti teadaoleva vendorId ja productId-ga. Saate kasutada järgmist filtrit:

            const filters = [
  {
    vendorId: 0x045e, // Microsoft
    productId: 0x028e, // Xbox 360 Controller
  },
];

navigator.hid.requestDevice({ filters })
  .then((devices) => {
    // Käsitse valitud seadet/seadmeid
  })
  .catch((error) => {
    // Käsitse vigu
  });

            

              
                Copy
              
            
          

Selles näites sobib filter ainult seadmetega, mille vendorId on 0x045e (Microsoft) ja productId on 0x028e (Xbox 360 Controller). Asendage need sihitava seadme vastava tootja ID ja toote ID-ga.

Näide 2: Mis tahes mängupuldi filtreerimine

Kui soovite lubada kasutajal valida mis tahes mängupuldi, saate kasutada filtrit, mis määrab mängupultide jaoks usagePage ja usage:

            const filters = [
  {
    usagePage: 0x01, // Generic Desktop Controls
    usage: 0x05, // Gamepad
  },
];

navigator.hid.requestDevice({ filters })
  .then((devices) => {
    // Käsitse valitud seadet/seadmeid
  })
  .catch((error) => {
    // Käsitse vigu
  });

            

              
                Copy
              
            
          

See filter sobib iga HID-seadmega, mis identifitseerib end standardsete HID-kasutuskoodide abil mängupuldina.

Näide 3: Filtrite kombineerimine

Paindlikkuse suurendamiseks saate kombineerida mitut filtrit. Näiteks võite soovida, et kasutaja saaks valida kas konkreetse mängupuldi mudeli või mis tahes mängupuldi:

            const filters = [
  {
    vendorId: 0x045e, // Microsoft
    productId: 0x028e, // Xbox 360 Controller
  },
  {
    usagePage: 0x01, // Generic Desktop Controls
    usage: 0x05, // Gamepad
  },
];

navigator.hid.requestDevice({ filters })
  .then((devices) => {
    // Käsitse valitud seadet/seadmeid
  })
  .catch((error) => {
    // Käsitse vigu
  });

            

              
                Copy
              
            
          

Sel juhul kuvab seadmevalija nii konkreetse Xbox 360 Controlleri (kui see on ühendatud) kui ka mis tahes muu seadme, mis identifitseerib end mängupuldina.

Näide 4: Spetsiifilise klaviatuuritüübi filtreerimine süsteemis

Mõned nišiklaviatuurid vajavad õigeks lähtestamiseks spetsiifilisi HID-koode. Järgnev näide eeldab, et teate klaviatuuri tootja ID-d, toote ID-d, kasutuslehte ja kasutust. Selle teabe leiate tavaliselt tootja dokumentatsioonist või enamikus operatsioonisüsteemides saadaolevate seadmete loetlemise tööriistade abil.

            const filters = [
    {
        vendorId: 0x1234,  // Asenda oma tootja ID-ga
        productId: 0x5678, // Asenda oma toote ID-ga
        usagePage: 0x07,   // Asenda oma kasutuslehega (nt Keyboard/Keypad)
        usage: 0x01      // Asenda oma kasutusega (nt Keyboard)
    }
];

navigator.hid.requestDevice({ filters })
  .then((devices) => {
    // Käsitse valitud seadet/seadmeid
  })
  .catch((error) => {
    // Käsitse vigu
  });

            

              
                Copy
              
            
          

Seadme teabe hankimine

Kui kasutaja on seadme valinud, saate selle teabele juurde pääseda HIDDevice objekti abil.

HIDDevice omadused

• vendorId: Seadme USB tootja ID.
• productId: Seadme USB toote ID.
• productName: Seadme nimi.
• collections: Massiiv HIDCollection objektidest, mis esindavad seadme HID-aruande kirjeldajaid.

Selle teabe abil saate seadet tuvastada ja oma rakendust vastavalt konfigureerida.

HID-aruannete käsitlemine

Pärast HIDDevice-i hankimist peate selle avama ja alustama HID-aruannete kuulamist. HID-aruanded on toorandmed, mida seade teie rakendusele saadab.

Seadme avamine

            device.open()
  .then(() => {
    console.log('Seade on avatud');

    // Alusta sisend-aruannete kuulamist
    device.addEventListener('inputreport', (event) => {
      const { data, reportId } = event;
      // Töötle sisend-aruannet
      console.log(`Vastu võetud sisend-aruanne ID-ga ${reportId}:`, data);
    });
  })
  .catch((error) => {
    console.error('Seadme avamine ebaõnnestus:', error);
  });

            

              
                Copy
              
            
          

Sisend-aruannete töötlemine

Sisend-aruanded võetakse vastu DataView objektidena. Andmete struktuur sõltub seadme HID-aruande kirjeldajast. Andmete tõlgendamiseks peate tutvuma seadme dokumentatsiooniga.

Siin on lihtsustatud näide sisend-aruande töötlemisest:

            device.addEventListener('inputreport', (event) => {
  const { data, reportId } = event;

  // Eeldades, et aruande esimene bait esindab nupu olekut
  const buttonState = data.getUint8(0);

  // Töötle nupu olekut
  if (buttonState & 0x01) {
    console.log('Nupp 1 vajutatud');
  }
  if (buttonState & 0x02) {
    console.log('Nupp 2 vajutatud');
  }
});

            

              
                Copy
              
            
          

See on väga lihtne näide. Pärismaailma HID-seadmetel on sageli keerukamad aruandestruktuurid. HID-aruande pöördprojekteerimine võib olla keeruline protsess; siiski on saadaval tööriistu, mis aitavad parsimisprotsessis.

Veakäsitlus

WebHID-iga töötamisel on oluline vigu sujuvalt käsitleda. Siin on mõned levinumad vead, millega võite kokku puutuda:

• SecurityError: Kasutaja on keelanud juurdepääsu HID-seadmetele.
• NotFoundError: Sobivaid seadmeid ei leitud.
• InvalidStateError: Seade on juba avatud.
• Muud vead: USB-vead, ootamatud seadme lahtiühendamised.

Pakkige oma WebHID-kood alati try...catch plokkidesse ja pakkuge kasutajale informatiivseid veateateid.

WebHID arenduse parimad praktikad

• Kasutage seadmefiltreid: Kasutage alati seadmefiltreid, et kitsendada kasutajale esitatavate seadmete loendit.
• Andke selged juhised: Juhendage kasutajaid seadme ühendamisel ja autoriseerimisel; kui seadet ei kuvata, selgitage kasutajale, kust leida levinumate seadmete tootja ID ja toote ID.
• Käsitlege vigu sujuvalt: Rakendage robustne veakäsitlus, et pakkuda sujuvat kasutajakogemust.
• Tutvuge seadme dokumentatsiooniga: Seadme HID-aruande kirjeldaja mõistmiseks tutvuge seadme dokumentatsiooniga.
• Testige mitmel platvormil: Ühilduvuse tagamiseks testige oma rakendust erinevates brauserites ja operatsioonisüsteemides.
• Mõelge turvalisusele: Olge kasutaja sisendiga töötamisel teadlik turvamõjudest. Puhastage andmeid ja vältige ebausaldusväärse koodi käivitamist.
• Pakkuge varuvariante: Kui WebHID ei ole toetatud või kasutaja keelab loa, pakkuge alternatiivseid sisestusmeetodeid.

Täiustatud tehnikad

Funktsiooniaruanded

Lisaks sisend-aruannetele saavad HID-seadmed saata ja vastu võtta ka funktsiooniaruandeid. Funktsiooniaruandeid kasutatakse seadme konfigureerimiseks või selle oleku hankimiseks.

Funktsiooniaruande saatmiseks kasutage meetodit device.sendFeatureReport().

            const reportId = 0x01;
const data = new Uint8Array([0x01, 0x02, 0x03]); // Näidisandmed

device.sendFeatureReport(reportId, data)
  .then(() => {
    console.log('Funktsiooniaruanne edukalt saadetud');
  })
  .catch((error) => {
    console.error('Funktsiooniaruande saatmine ebaõnnestus:', error);
  });

            

              
                Copy
              
            
          

Funktsiooniaruande vastuvõtmiseks kasutage meetodit device.getFeatureReport().

            const reportId = 0x01;

device.getFeatureReport(reportId)
  .then((data) => {
    console.log('Vastu võetud funktsiooniaruanne:', data);
  })
  .catch((error) => {
    console.error('Funktsiooniaruande hankimine ebaõnnestus:', error);
  });

            

              
                Copy
              
            
          

Väljundaruanded

WebHID toetab ka väljundaruandeid, mis võimaldavad teil saata andmeid seadmele. Näiteks võite kasutada väljundaruandeid seadme LED-tulede või muude aktuaatorite juhtimiseks.

Väljundaruande saatmiseks kasutage meetodit device.sendReport().

            const reportId = 0x01;
const data = new Uint8Array([0x01, 0x02, 0x03]); // Näidisandmed

device.sendReport(reportId, data)
  .then(() => {
    console.log('Väljundaruanne edukalt saadetud');
  })
  .catch((error) => {
    console.error('Väljundaruande saatmine ebaõnnestus:', error);
  });

            

              
                Copy
              
            
          

Turvakaalutlused

WebHID juurdepääs nõuab kasutaja luba, mis aitab leevendada mõningaid turvariske. Siiski on oluline olla teadlik võimalikest haavatavustest.

• Andmete puhastamine: Puhastage alati HID-seadmetest saadud andmeid, et vältida koodisüstimist või muid rünnakuid.
• Päritolupiirangud: WebHID allub sama päritolu poliitikale, mis takistab ristpäritoluga juurdepääsu HID-seadmetele.
• Kasutajate teadlikkus: Harige kasutajaid HID-seadmetele juurdepääsu andmisega seotud riskidest ja julgustage neid andma luba ainult usaldusväärsetele veebisaitidele.

Globaalsed perspektiivid ja näited

WebHID API-l on globaalne mõju, võimaldades arendajatel luua veebirakendusi, mis toetavad laia valikut seadmeid erinevatelt tootjatelt ja piirkondadest. Mõelge nendele näidetele:

• Mängimine: Erinevate tootjate mängupultide toetamine erinevates riikides (nt Sony PlayStationi kontrollerid, Microsoft Xboxi kontrollerid, Nintendo Switch Pro Controller ning vähemtuntud kaubamärgid Aasiast ja Euroopast).
• Ligipääsetavus: Kohandatud sisendseadmete loomine puuetega kasutajatele, võttes arvesse erinevaid piirkondlikke ligipääsetavusstandardeid ja eelistusi. Näiteks spetsialiseeritud klaviatuurid või lülitiliidesed, mis on loodud spetsiifilisteks vajadusteks ja saadaval erinevates paigutustes.
• Tööstusautomaatika: Ühendumine tööstuslike kontrollerite ja anduritega, mida kasutatakse tootmistehastes üle maailma, toetades erinevaid sideprotokolle ja andmevorminguid.
• Teadusuuringud: Ühendumine teadusinstrumentidega, mida kasutatakse uurimislaborites kogu maailmas, võimaldades teadlastel koguda ja analüüsida andmeid otse veebirakendustes. Kujutage ette laboriseadmete juhtimist Tokyo ülikoolis Londonis asuva teadlase sülearvutist.
• Haridus: Haridusrobotite ja interaktiivsete seadmete toetamine, mida kasutatakse klassiruumides kogu maailmas, pakkudes õpilastele praktilisi õpikogemusi. See võib hõlmata Hiinas toodetud kodeerimisroboteid, mida kasutatakse Brasiilia klassiruumis.

WebHID vs. teised veebi API-d

Tasub märkida, kuidas WebHID võrdleb teiste seadmete interaktsiooniga seotud veebi API-dega:

• Gamepad API: Gamepad API pakub kõrgema taseme liidest spetsiaalselt mängupultidele. WebHID pakub rohkem paindlikkust ja kontrolli, kuid nõuab seadmeandmete suuremat käsitsi käsitlemist. Gamepad API sobib hästi levinud mängupultidele, samas kui WebHID suudab toetada eksootilisemaid või spetsialiseeritud sisendseadmeid.
• WebUSB API: WebUSB võimaldab veebirakendustel suhelda otse USB-seadmetega. WebHID on spetsiaalselt loodud inimliideseseadmetele, samas kui WebUSB-d saab kasutada laiemas valikus USB-seadmete jaoks. WebUSB-d võiks kasutada spetsialiseeritud teadusinstrumendi jaoks, mis on ühendatud USB kaudu, samas kui kohandatud klaviatuuri või hiire jaoks kasutataks WebHID-i.
• Web Serial API: Web Serial võimaldab sidet jadaportide kaudu. See on kasulik interaktsiooniks manussüsteemide ja muude seadmetega, mis suhtlevad jadaliideste kaudu. Mikrokontroller, mis saadab andmeid jadaühenduse kaudu, võiks kasutada Web Seriali, samas kui eritellimusel ehitatud juhtkang kasutaks WebHID-i.

WebHID-i tulevik

WebHID API areneb pidevalt, pidevate jõupingutustega selle turvalisuse, jõudluse ja kasutusmugavuse parandamiseks. Kuna üha rohkem seadmeid võtab kasutusele HID-standardi, muutub WebHID veebiarendajate jaoks üha olulisemaks tööriistaks. Tulevikus on oodata täiustatud funktsioone ja paremat brauserituge.

Kokkuvõte

WebHID on võimas API, mis avab veebirakendustele laia valiku võimalusi. Mõistes seadmefiltreid ja kuidas käsitleda HID-aruandeid, saate luua kaasahaaravaid ja interaktiivseid veebikogemusi, mis kasutavad ära inimliideseseadmete täielikku potentsiaali. Ükskõik, kas ehitate mängu, ligipääsetavustööriista või tööstuslikku juhtimissüsteemi, aitab WebHID teil ühendada oma veebirakenduse füüsilise maailmaga. Pidage meeles, et edukate ja globaalselt kättesaadavate WebHID-rakenduste loomiseks tuleb eelistada kasutajakogemust, turvalisust ja platvormideülest ühilduvust.