Desenvolvimento WebXR com JavaScript
Importante
O WebVR foi preterido e não está disponível nos navegadores atuais, portanto, não deve ser usado para nenhum novo desenvolvimento. Você precisará migrar todas as implementações WebVR existentes para o WebXR.
WebXR continua disponível. No entanto, o suporte para WebXR é descontinuado (sem correções de bugs, atualizações de conteúdo ou suporte técnico) e, portanto, não podemos garantir que os aplicativos continuarão a funcionar por um longo período de tempo.
JavaScript é uma das linguagens de programação mais populares do mundo! É simples, leve e amplamente utilizado na Web. Crie experiências de Realidade Mista mais envolventes aplicando o poder das suas competências em JavaScript e Web.
Aplicações de Realidade Mista na Web
As funcionalidades de Realidade Mista estão disponíveis na Web através do WebXR. Você pode ver conteúdo de realidade virtual (VR) e realidade aumentada (AR) em um navegador compatível habilitado para WebXR sem instalar mais software ou plugins. Você pode usar esse mesmo navegador com um dispositivo físico como o HoloLens 2.
A API de dispositivo WebXR destina-se a aceder a dispositivos de realidade virtual (VR) e realidade aumentada (AR), incluindo sensores e head-mounted displays, na Web. A API de dispositivo WebXR está disponível no Microsoft Edge e Chrome versão 79, e versões posteriores suportam WebXR como padrão. Você pode verificar o status mais recente do suporte do navegador para WebXR em caniuse.com.
| Recurso WebXR | Disponibilidade |
|---|---|
| API de dispositivo WebXR (w3.org) | Edge 81 na área de trabalho do Windows Edge 91 no HoloLens 2 |
| Módulo de Realidade Aumentada WebXR - Nível 1 (w3.org) | Aresta 91. HoloLens 2 apenas |
| Módulo de entrada manual WebXR - Nível 1 (w3.org) | Aresta 93. HoloLens 2 apenas |
| Módulo de âncoras WebXR (immersive-web.github.io) | Aresta 93. HoloLens 2 apenas |
| Módulo de teste de acerto WebXR (immersive-web.github.io) | Aresta 93. HoloLens 2 apenas |
Visualizando WebXR
Você pode visualizar experiências WebXR no Windows Mixed Reality com os novos navegadores Microsoft Edge e Firefox Reality . Para testar se seu navegador suporta WebXR, você pode navegar até Exemplos WebXR em seu navegador.
O que posso usar para desenvolver experiências imersivas na Web?
A lista a seguir mostra as estruturas JavaScript e APIs para criar experiências imersivas que atualmente dominam o mercado e são amplamente aceitas e adotadas por desenvolvedores JavaScript de realidade mista:
| Estrutura | Exemplo |
|---|---|
| Babylon.js Babylon é um motor JavaScript 3D que facilita o desenvolvimento de conteúdo 3D e aplicações imersivas. Antes de começar a usar aplicativos imersivos, recomendamos que você aprenda as noções básicas de desenvolvimento de Babylon.js. - Aprenda a construir aplicações 3D com Babylon.js: Introdução - Jogue com exemplos 3D e seu código-fonte usando Babylon.js: Playground - Aprofunde-se no WebXR - Saiba como começar com nossos tutoriais: Crie seu primeiro aplicativo "Hello World!" |
 |
| Quadro A A-frame é uma estrutura JavaScript declarativa que você pode usar para começar a usar a Realidade Virtual na Web. Para saber mais, consulte a documentação do A-Frame |
 |
| Three.js Three.js é uma biblioteca 3D popular para criar experiências imersivas. Saiba mais sobre three.js e explore exemplos. |
 |
| WebGL Você pode acessar as APIs de dispositivo WebXR diretamente usando APIs WebGL. WebGL (Web Graphics Library) é uma API JavaScript para renderizar gráficos 3D e 2D interativos de alto desempenho em qualquer navegador da Web compatível sem o uso de plug-ins. |
 |
Consulte Também
- Especificação da API de dispositivo WebXR
- Documentação da API de dispositivo WebXR
- Exemplos WebXR
- Immersiveweb.dev
- Usando Babylon.js para criar experiências WebXR
- WebGL API
- API do Gamepad e Extensões do Gamepad
- Windows Mixed Reality e o novo Microsoft Edge
- Manipulando contexto perdido no WebGL
- Pointerlock
- glTF
- Grupo imersivo da comunidade web
- Web imersivo W3C Github