Pengembangan WebXR dengan JavaScript

2024-10-31

Penting

WebVR tidak digunakan lagi dan tidak tersedia di browser saat ini, sehingga tidak boleh digunakan untuk pengembangan baru apa pun. Anda harus memigrasikan implementasi WebVR yang ada diteruskan ke WebXR.

WebXR terus tersedia. Namun, dukungan untuk WebXR dihentikan (tidak ada perbaikan bug, pembaruan konten, atau dukungan teknis), dan oleh karena itu kami tidak dapat menjamin bahwa aplikasi akan terus berfungsi untuk jangka waktu yang lama.

JavaScript adalah salah satu bahasa pemrograman paling populer di dunia! Ini sederhana, ringan, dan banyak digunakan di Web. Buat pengalaman Mixed Reality yang lebih menarik dengan menerapkan kekuatan JavaScript dan keterampilan Web Anda.

Aplikasi Mixed Reality di web

Fitur Mixed Reality tersedia di Web melalui WebXR. Anda dapat melihat konten realitas virtual (VR) dan realitas tertambah (AR) di browser yang mendukung WebXR yang kompatibel tanpa menginstal perangkat lunak atau plugin lainnya. Anda dapat menggunakan browser yang sama dengan perangkat fisik seperti HoloLens 2.

WEBXR Device API adalah untuk mengakses perangkat realitas virtual (VR) dan realitas tertambah (AR), termasuk sensor dan tampilan yang dipasang di kepala, di Web. WebXR Device API tersedia di Microsoft Edge dan Chrome versi 79, dan versi yang lebih baru mendukung WebXR sebagai default. Anda dapat memeriksa status dukungan browser terbaru untuk WebXR di caniuse.com.

Fitur WebXR	Ketersediaan
WEBXR Device API (w3.org)	Edge 81 di Windows Desktop Edge 91 di HoloLens 2
Modul Realitas Tertambah WebXR - Tingkat 1 (w3.org)	Edge 91. Hanya HoloLens 2
Modul Input Tangan WebXR - Tingkat 1 (w3.org)	Edge 93. Hanya HoloLens 2
Modul WebXR Anchors (immersive-web.github.io)	Edge 93. Hanya HoloLens 2
Modul Uji Hit WebXR (immersive-web.github.io)	Edge 93. Hanya HoloLens 2

Menampilkan WebXR

Anda dapat melihat pengalaman WebXR di Windows Mixed Reality dengan browser Microsoft Edge dan Firefox Reality baru. Untuk menguji apakah browser Anda mendukung WebXR, Anda dapat menavigasi ke Sampel WebXR di browser Anda.

Apa yang dapat saya gunakan untuk mengembangkan pengalaman Web imersif?

Daftar berikut menunjukkan kerangka kerja dan API JavaScript untuk membangun pengalaman imersif yang saat ini mendominasi pasar dan diterima secara luas dan diadopsi oleh pengembang JavaScript realitas campuran:

Kerangka	Contoh
Babylon.js Babylon adalah mesin 3D JavaScript yang memudahkan pengembangan konten 3D dan aplikasi imersif. Sebelum memulai aplikasi imersif, kami sarankan Anda mempelajari dasar-dasar pengembangan Babylon.js. - Pelajari cara membangun aplikasi 3D dengan Babylon.js: Memulai - Bermain dengan contoh 3D dan kode sumbernya menggunakan Babylon.js: Playground - Menyelam lebih dalam ke WebXR - Pelajari cara memulai tutorial kami: Membuat aplikasi "Halo Dunia!" pertama Anda
A-Frame A-frame adalah kerangka kerja JavaScript deklaratif yang dapat Anda gunakan untuk memulai Virtual Reality di Web. Untuk mempelajari lebih lanjut , lihat dokumentasi A-Frame
Three.js Three.js adalah pustaka 3D populer untuk menciptakan pengalaman imersif. Pelajari selengkapnya tentang three.js dan jelajahi contoh.
WebGL Anda dapat mengakses API Perangkat WebXR secara langsung dengan menggunakan API WebGL. WebGL (Web Graphics Library) adalah API JavaScript untuk merender grafik 3D interaktif dan 2D berkinerja tinggi dalam browser Web yang kompatibel tanpa menggunakan plug-in.