Desenvolvimento do WebXR com JavaScript
O JavaScript é uma das linguagens de programação mais populares do mundo! É simples, leve e amplamente usado na Web. Aproveite o poder das habilidades do JavaScript e da Web para criar experiências de Realidade Misturada mais envolventes.
Realidade Misturada aplicativos na Web
Realidade Misturada recursos estão disponíveis na Web por meio do WebXR. Você pode ver o conteúdo de REALIDADE Virtual (VR) e AR (realidade aumentada) em um navegador compatível habilitado para WebXR sem instalar nenhum software ou plug-in adicional. Você pode usar esse mesmo navegador com um dispositivo físico como o HoloLens 2.
A API de Dispositivo WebXR é para acessar dispositivos de REALIDADE Virtual (VR) e AR (realidade aumentada), incluindo sensores e telas montadas na cabeça, na Web. A API de Dispositivo WebXR está disponível no Microsoft Edge e no Chrome versão 79 e versões posteriores dão suporte a WebXR como padrão. Você pode marcar o status de suporte mais recente do navegador para WebXR em caniuse.com.
Observação
O WebVR foi preterido e não está disponível nos navegadores atuais, portanto, ele não deve ser usado para nenhum novo desenvolvimento. Você precisará migrar todas as implementações existentes do WebVR para o WebXR.
| 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 do WebXR – Nível 1 (w3.org) | Edge 91. Somente Hololens 2 |
| Módulo de entrada manual webxr - nível 1 (w3.org) | Edge 93. Somente Hololens 2 |
| Módulo Âncoras webXR (immersive-web.github.io) | Edge 93. Somente Hololens 2 |
| Módulo de teste de ocorrência do WebXR (immersive-web.github.io) | Edge 93. Somente Hololens 2 |
Exibindo o WebXR
Você pode exibir experiências do WebXR em Windows Mixed Reality com os novos navegadores Microsoft Edge e Firefox Reality. Para testar se o navegador dá suporte ao WebXR, navegue até Exemplos de WebXR no navegador.
O que posso usar para desenvolver experiências imersivas na Web?
A lista a seguir mostra as estruturas e APIs do JavaScript para criar experiências imersivas que atualmente dominam o mercado e são amplamente aceitas e adotadas por desenvolvedores javaScript de realidade misturada:
| Estrutura | Exemplo |
|---|---|
| Babylon.js O Babylon é um mecanismo 3D do JavaScript que facilita o desenvolvimento de conteúdo 3D e de aplicativos imersivos. Antes de começar a usar aplicativos imersivos, recomendamos que você aprenda os conceitos básicos do desenvolvimento de Babylon.js. – Saiba como criar aplicativos 3D com Babylon.js: Introdução – Reproduza com exemplos 3D e seu código-fonte usando Babylon.js: Playground - Aprofunde-se no WebXR – Saiba como começar a usar nossos tutoriais: criar seu primeiro aplicativo "Olá, Mundo!" |
 |
| Cavalete A-frame é uma estrutura Declarativa do JavaScript que você pode usar para começar a usar a Realidade Virtual na Web. Para saber mais, marcar a documentação do Quadro A |
 |
| Three.js Three.js é uma biblioteca 3D popular para criar experiências imersivas. Saiba mais sobre three.js e explorar exemplos. |
 |
| WebGL Você pode acessar as APIs do Dispositivo WebXR diretamente usando APIs WebGL. WebGL (Biblioteca de Gráficos Web) é uma API JavaScript para renderizar elementos 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 do Dispositivo WebXR
- Documentação da API do Dispositivo WebXR
- Exemplos de WebXR
- Immersiveweb.dev
- Usando Babylon.js para criar experiências do WebXR
- WebGL API
- Extensões da API do Gamepad e do Gamepad
- Windows Mixed Reality e o novo Microsoft Edge
- Tratamento de contexto perdido na WebGL
- Pointerlock
- glTF
- Grupo imersivo da comunidade Web
- Imersivo Web W3C Github