Kas ir WebXR: Pilnīgs ceļvedis paplašinātās realitātes, virtuālās realitātes un rezonanses izpratnei tīmeklī

Veids, kā mēs orientējamies internetā, piedzīvo milzīgu lēcienu: tīmeklis tagad ir arī vieta ieskaujošām pieredzēm. WebXR ir tilts, kas virtuālo realitāti (VR) un paplašināto realitāti (AR) pārnes tieši uz jūsu pārlūkprogrammu bez apgrūtinošas instalēšanas vai nebeidzamām darbībām. Ja kādreiz esat domājuši: "Tam vajadzētu atvērties ar saiti", jūs esat nonācis īstajā vietā.

Mēs runājam par atvērtu tehnoloģiju, ko virza W3C un kas savieno ikdienas JavaScript ar sensoriem, kamerām un XR skatītājiem. Sākot ar dīvāna izmēģināšanu viesistabā un beidzot ar 360° muzeja apskati, visu var sākt, noklikšķinot uz URL . Un jā, ir viens āķis: standarti, API, 3D dzinēji un strauji attīstoša ekosistēma.

Kas ir WebXR un kāpēc tas ir svarīgi?

WebXR ir specifikācija, kas nodrošina XR (AR, VR un MR) pieredzi tīmeklī. Tā ļauj uzsākt ieskaujošas sesijas tieši no pārlūkprogrammas , piekļūstot ierīces iespējām, piemēram, kustību izsekošanai, kontrolieriem, rokām, sensoriem un kamerām. Īsāk sakot: pārlūkprogramma kļūst par “XR lietojumprogrammu”.

Standartu izstrādā W3C, un to ievieš pārlūkprogrammas (“klienti”) katrā platformā. 3D renderēšanai tas balstās uz tādām API kā WebGL un arvien biežāk WebGPU; telpiskā skaņa tiek piegādāta, izmantojot WebAudio . Tas nozīmē, ka varat programmēt JavaScript/TypeScript valodā un izvietot to jebkurā tīmekļa vietnē.

Papildus virsrakstam ir arī svarīga atziņa: WebXR demokratizē piekļuvi ieskaujošām pieredzēm . Jums nav jāpublicē lietotnes lietotņu veikalā vai jāpiespiež lietotāji instalēt vietējās lietotnes : vienkārši kopīgojiet saiti sociālajos tīklos, QR kodu uz plakāta vai pogu savā e-komercijas vietnē.

WebXR pieredzes veidi

• AR (paplašinātā realitāte tīmeklī): izmantojot ierīces kameru, pārklāj digitālos objektus uz fiziskās pasaules. Mūsdienās modernās pārlūkprogrammas dažās vidēs piedāvā vietējās papildinātās realitātes (AR) iespējas, izmantojot WebXR, kas Uzlabo veiktspēju salīdzinājumā ar tikai tīmekļa izsekošanas bibliotēkāmTipiski gadījumi: pilna mēroga produktu testēšana, interaktīvas instrukcijas vai gidi.
• VR (virtuālā realitāte tīmeklī): pilnībā iegremdē lietotāju 3D vidē. Ar saderīgām austiņām, Jūs varat izpētīt pasaules, simulēt apmācību vai skatīt arhitektūru no pārlūkprogrammas.Mijiedarbība ietver kontrolierus, rokas un vides fiziku.
• MR (jauktā realitāte tīmeklī): apvieno fizisko un digitālo ar divvirzienu mijiedarbību. Virtuālie objekti pastāv līdzās reālajai telpai, atverot durvis uz produktivitātes lietotnes, sadarbības izglītība un spēles, kas reaģē uz vidi.
• Vienmērīga pāreja starp AR un VRStandarts ļauj pāriet no vienas sesijas uz citu bez jebkādiem pārtraukumiem. Jūs sākat VR režīmā, lai sniegtu instruktāžu, un pārejiet uz AR, lai novietotu objektu savā viesistabā., vienas un tās pašas pieredzes ietvaros.

WebXR galvenās priekšrocības

Īsta starpplatforma

Pieredze darbojas jebkurā ierīcē ar pārlūkprogrammu: austiņās, piemēram, MetaQuest vai HoloLens, datoros, planšetdatoros un mobilajos tālruņos. Ideāli piemērots, lai sasniegtu lielu auditoriju, vienlaikus saglabājot atvērtību papildinātajai realitātei (AR) un virtuālajai realitātei (VR).

Gatavs tam, kas gaidāms

Tīmekļa standarti attīstās līdz ar jaunām ierīcēm. Jūsu kosmosa tīmekļa lietotne var darboties nākotnes aparatūrā jau no pirmās dienas , pat uz jaunizlaistām platformām.

Bezberzes piekļuve

Vienkārši atveriet URL, un viss ir izdarīts. Instalēšana nav nepieciešama, lai gan to var "instalēt" kā PWA, izmantojot "Pievienot sākuma ekrānam" un pakalpojumu darbiniekus, lai iespējotu bezsaistes funkcionalitāti.

Agile publicēšana

Vietne nav atkarīga no atsevišķu veikalu kūrēšanas. Jūs to augšupielādējat serverī, norādiet uz domēnu un atjauniniet visiem ar vienu izvietojumu . Tik vienkārši.

Dalīšanās ir triviāla

Saite tiek kopīgota sociālajos tīklos, reklāmās vai QR kodos. Jūs skenējat plakātu un acumirklī palaižat paplašinātās realitātes pieredzi bez jebkādām instalēšanas problēmām.

Kā WebXR darbojas iekšpusē

Pārlūkprogramma atver WebXR ierīces API sesiju atvēršanai (“inline”, “immersive-ar”, “immersive-vr”), galvas/rokas/kontroliera pozu vaicājumiem un zīmēšanai XR ierīces ekrānā. 3D aina parasti tiek atveidota ar WebGL vai WebGPU, bet telpiskā skaņa — ar WebAudio . Parasti ir pieejams index.html fails, JavaScript kods un 3D resursi.

Standartizācijā vispirms tiek definēts API, un pēc tam pārlūkprogrammas to ievieš (dažreiz aiz karodziņiem), lai saņemtu atsauksmes. Versiju atbalstu var atrast vietnē caniuse.com vai katras pārlūkprogrammas ceļvedī.

Pirms koda rakstīšanas ir vērts izvēlēties ietvaru. Ja vēlaties uzreiz ķerties pie lietas, varat strādāt ar vietējo JavaScript un WebGL/WebGPU ; ja dodat priekšroku produktivitātei, izvēlieties dzinējus vai ietvarus, kas jau integrē WebXR.

WebAR statusa un izsekošanas bibliotēkas

Lai gan WebXR definē papildināto realitāti (AR), AR izsekošanas ieviešana vēsturiski ir attīstījusies lēnāk nekā virtuālajā realitātē (VR) . Tāpēc trešo pušu bibliotēkas (8thwall, zappar, holoLink) bieži tiek izmantotas attēlu/marķieru izsekošanai un citām metodēm mobilajās ierīcēs.

Ja dodat priekšroku atvērtā pirmkoda programmatūrai, dažādiem izsekošanas veidiem ir pieejamas alternatīvas, piemēram, MindAR, ARToolkit.js vai AlvaAR . Un ņemiet vērā: dažas platformas papildus WebXR atbalstam piedāvā savas izsekošanas bibliotēkas, lai novērstu trūkumus, piemēram, attēlu izsekošanu noteiktās pārlūkprogrammās.

SLAM WebXR kontekstā

SLAM (vienlaicīga lokalizācija un kartēšana) apvieno lokalizāciju un kartēšanu reāllaikā. Tā ir pamats virtuālo objektu saskaņotai piesaistei fiziskajai pasaulei , nosakot plaknes, sienas un vides elementus, izmantojot kameru, akselerometru un žiroskopu.

WebXR AR pieredzē SLAM ļauj 3D modelim "palikt" tur, kur tas tiek novietots. Bez labas izsekošanas objekti peld vai dejo, un maģija tiek zaudēta . Ar labi integrētu SLAM mijiedarbība ir ticama un stabila.

Pārlūkprogrammas un pašreizējais atbalsts

Atbalsts atšķiras atkarībā no versijas un platformas, tāpēc ieteicams pārbaudīt atjaunināto dokumentāciju. Chrome ir bijis līderis un integrē WebXR savās jaunākajās versijās . Firefox un Edge (Chromium) arī piedāvā atbalstu, ar variācijām atkarībā no sistēmas un ierīces. Ir arī vērts pārbaudīt saderību ar tādām platformām kā Windows Mixed Reality.

Austiņās Meta Quest pārlūkprogramma piedāvā iebūvētu WebXR , kas atvieglo VR un AR pieredzes iegūšanu tīmeklī. Apple ekosistēmā Safari paziņoja par uzlabojumiem WWDC23 konferencē, un Apple Vision Pro versijā WebXR atbalsts ir pieejams aiz karodziņa ; iPhone/iPad ierīcēs statuss var atšķirties un mainīties ar katru laidienu.

Paturiet prātā, ka saderība var atšķirties atkarībā no versijas un platformas , un ka vecākām vai retāk izmantotām pārlūkprogrammām var nebūt atbalsta vai arī atbalsts var būt ierobežots.

Atbalstīto ierīču un aparatūras pārskats

Kamēr vien ir pieejama pārlūkprogramma ar WebXR, pastāv iespējas. Darbvirsmā daudzas austiņas darbojas ar Chrome, izmantojot SteamVR kā OpenXR izpildlaiku . Tomēr ir izņēmumi: PSVR/PSVR2 un HTC Vive Flow nepiedāvā WebXR, jo tām nav pieejama saderīga pārlūkprogramma. Ja jums ir nepieciešama iestatīšanas rokasgrāmata operētājsistēmai Windows , skatiet VR austiņu iestatīšanas rokasgrāmatu operētājsistēmai Windows.

Sākot ar 2023. gada jūliju, ir pieejamas šādas ierīces ar pārlūkprogrammu: Meta Quest (1/2/3/Pro), Rift/Rift S; Apple Vision Pro; Microsoft HoloLens 1/2; HTC Vive/Fiocus/Elite XR; Pico Neo; Huawei VR; Samsung Gear VR/Odyssey; Google Cardboard/Daydream; Varjo VR-1/2/3; Valve Index; Magic Leap 1/2; Lynx R-1; Lenovo ThinkReality; HP Reverb G2 . Vienmēr pārbaudiet konkrēto versiju un pārlūkprogrammu.

Fabricante	Ierīce
meta	Kvests, Kvests 2, Kvests Pro, Kvests 3, Rift, Rift S
Manzana	VisionPro
microsoft	HoloLens 1, HoloLens 2
HTC	Vive Focus 3, Vive Elite XR, Vive, Vive Pro, Vive Pro 2
Pico	Neo 3, 4, 4 Enterprise
Huawei	VR 3DoF, VR 6DoF
samsung	Gear VR, Odyssey
google	Kartons, Daydream View
Varjo	VR‑1, VR‑2, VR‑3
Vārsts	Indekss
Magic Leap	1 un 2
lūsis	R‑1
Lenovo	ThinkReality VRX, A3
HP	Reverb G2

Ja nav saderīgas pārlūkprogrammas, nav arī WebXR. Ja jūsu skatītājs ļauj instalēt modernu pārlūkprogrammu ar WebXR Device API, iespējas palielinās.

Android XR ar Chrome: dziļums, rokas un divi ekrāni

Pielāgojot pieredzi operētājsistēmai Android XR , atcerieties, ka renderēšana ir stereo (viens skats katrai acij). Jums ir jākonfigurē divi skata logi un jāapstrādā ar roku prioritārā ievade, ja ierīce to vēlas . Mainiet arī lietotāja interfeisa mijiedarbības modeli un attiecīgi mērogojiet.

// Bucle de frame en una XRSession con WebGL, render estéreo y profundidad
function onXRFrame(time, frame) {
  const session = frame.session;
  session.requestAnimationFrame(onXRFrame);
  const layer = session.renderState.baseLayer;
  const pose = frame.getViewerPose(xrRefSpace);
  if (!pose) return;

  gl.bindFramebuffer(gl.FRAMEBUFFER, layer.framebuffer);
  gl.clearColor(0, 0, 0, 0);
  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

  for (const view of pose.views) {
    const vp = layer.getViewport(view);
    gl.viewport(vp.x, vp.y, vp.width, vp.height);

    // Profundidad estéreo: un mapa por ojo si está disponible
    const depthInfo = frame.getDepthInformation(view);
    if (depthInfo) {
      renderDepthGPU(depthInfo, view, vp);
    }

    renderSceneForView(view);
  }
}

Lietas, kas jāņem vērā: Lai piekļūtu dziļumam, ir nepieciešama derīga poza , pose.views nodrošina vienu skatu katrai acij, un cikls darbojas divreiz, un ēnotāja cauruļvadam ir jāņem vērā aizsegšana/sadursme saskaņā ar dziļuma karti.

Mijiedarbība ar rokām un ievadi

Manuāla ievade ir galvenā Android XR funkcija, un Chrome to atbalsta kā noklusējuma ievades metodi. Rokas izsekošanas API ļauj veikt tādus žestus kā objektu saspiešana, satveršana vai stumšana , izmantojot notikumus un pirkstu locītavas.

Mobilajās ierīcēs vai displejos, kas koncentrējas uz kontrolieriem, manuāla ievade var nebūt pieejama vai būt pieejama tikai daļēji. Jūsu lietotnei ir jānosaka iespējas un korekti jāpāriet uz kontrolieriem vai skārienevadi, nepārtraucot mijiedarbību.

Atļaujas un privātums

Lai atvērtu AR/VR sesijas, ir nepieciešamas tādas atļaujas kā kameras izsekošana un 3D kartēšana, un citas atļaujas (seja, acis, rokas) ir papildus aizsargātas. Pārlūkprogramma pieprasa atļauju pēc domēna un atceras preferenci ; ja kādas atļaujas trūkst, sesija netiks sākta.

Tāpat kā jebkura tīmekļa API, tā labi apstrādā atteikumus un paziņo lietotājam, kāpēc jums ir nepieciešama katra atļauja un ko viņi saņem apmaiņā.

Lietošanas gadījumi, kas jau darbojas ļoti labi

E-komercija ar papildināto realitāti : attēlojiet produktus reālā mērogā klienta telpā. Uzticība palielinās, bet peļņa samazinās. Atzveltnes krēsla ieraudzīšana viesistabā pirms tā iegādes maina spēles noteikumus.

Mārketings un reklāma : kampaņas ar papildinātās realitātes minispēlēm un interaktīvām pieredzēm, kas veicina zīmola atpazīstamību. No QR koda veikala skatlogā līdz filtram, kas "atdzīvojas" uz ielas.

Rūpniecība un apmācība : drošas simulācijas apmācībai, risku novēršanai un sarežģītām procedūrām. Digitālie dvīņi, ražošanas līnijas un interaktīvi kontrolsaraksti ietaupa laiku un novērš negadījumus.

Izglītība : abstrakti jēdzieni 3D formātā, virtuālās laboratorijas un muzeju apmeklējumi. Iegremdējoša mācīšanās ir saistoša un labāk iegaumējama.

Arhitektūra un nekustamais īpašums : 3D modeļu pārskatīšana kopā ar klientiem un virtuālas īpašumu apskates. Pamatotāki lēmumi pirms būvniecības.

Tūrisms un kultūra : 360° ekskursijas, izstādes un mantojuma vietas, ko var izpētīt no mājām vai uz vietas, izmantojot paplašinātās realitātes pārklājumus. Kultūras pieejamība strauji palielinās ar vienkāršu saiti.

PWA: “lietotnes” pieskāriens, neizejot no tīmekļa

PWA piešķir jūsu XR pieredzei vietējās lietotnes izskatu un darbību. Pievienojot to sākuma ekrānam, tā tiek atvērta atsevišķā logā bez URL joslas , un jūs varat kešatmiņā saglabāt resursus darbam bezsaistē.

Izmantojot pakalpojumu darbiniekus un kešatmiņu, jūs pārtverat pieprasījumus un nepieciešamības gadījumā atbildat bezsaistē. Tas uzlabo latentumu un novērš pārtraukumus demonstrāciju vai pasākumu laikā , kad savienojums ne vienmēr ir uzticams.

WebGL, WebGL 2 un pāreja uz WebGPU

WebGL nodrošina GPU paātrinātu 2D/3D zīmēšanu pārlūkprogrammā, apvienojot elementus ar DOM. Programmas apvieno JavaScript vadībai un GLSL ES ēnotājus GPU , un to nodrošina Khronos.

WebGL grupu 2009. gadā dibināja Apple, Google, Mozilla un Opera, un 1.0 versija tika izlaista 2011. gadā. ANGLE 2011. gadā ieguva OpenGL ES 2.0 sertifikātu, uzlabojot pārnesamību ; 2012. gadā Autodesk ieviesa WebGL tādas lietotnes kā AutoCAD 360. WebGL 2, kuras pamatā ir OpenGL ES 3.0, tika pārtraukta 2017. gadā (Firefox 51. versija, Chrome 56. versija, Opera 43. versija).

Tikmēr W3C reklamē WebGPU kā modernu pēcteci ar labāku piekļuvi GPU . WebXR gadījumā tas nozīmē sarežģītākas ainas, uzlabotus materiālus un efektīvākas renderēšanas metodes.