WebXR application life cycle
Trong hướng dẫn này, chúng ta sẽ có cái nhìn tổng quan từ trên cao về những gì liên quan đến việc tạo và điều khiển một ứng dụng WebXR, mà không đi xuống chi tiết ở mức mã. Điều này là phần chuẩn bị cho vài bài viết tiếp theo trong loạt hướng dẫn WebXR, gồm khởi động và tắt một phiên WebXR, hình học, mô phỏng camera, theo dõi không gian, và nhiều nội dung khác.
Life cycle outline
Phần lớn ứng dụng dùng WebXR sẽ theo một mẫu thiết kế tổng thể tương tự:
-
Kiểm tra xem thiết bị và trình duyệt của người dùng có đủ khả năng trình bày trải nghiệm XR mà bạn muốn cung cấp hay không.
- Đảm bảo WebXR API khả dụng; nếu
navigator.xrlàundefined, bạn có thể giả định rằng trình duyệt và/hoặc thiết bị của người dùng không hỗ trợ WebXR. Nếu không được hỗ trợ, hãy vô hiệu hóa mọi giao diện dùng để kích hoạt tính năng XR và hủy mọi thử cố vào chế độ XR. - Gọi
navigator.xr.isSessionSupported(), chỉ định chế độ trải nghiệm WebXR bạn muốn cung cấp:inline,immersive-vr, hoặcimmersive-ar, để xác định kiểu phiên bạn muốn có khả dụng hay không. - Nếu kiểu phiên bạn muốn dùng khả dụng, hãy cung cấp giao diện phù hợp cho người dùng để họ có thể kích hoạt nó.
- Đảm bảo WebXR API khả dụng; nếu
-
Khi người dùng yêu cầu kích hoạt chức năng WebXR bằng cách tương tác với giao diện ở trên, hãy yêu cầu một
XRSessionbằng chế độ mong muốn. Việc này được thực hiện bằng cách gọinavigator.xr.requestSession(), cũng chỉ định chuỗi biểu thị chế độ bạn muốn bật:inline,immersive-vr, hoặcimmersive-ar. -
Nếu promise do
requestSession()trả về được resolve, hãy dùngXRSessionmới để quản lý phiên WebXR trong suốt thời gian trải nghiệm WebXR. Điều này sẽ bao gồm việc quản lý đầu vào, hoạt ảnh và kết xuất.- Gọi phương thức
XRSessionrequestAnimationFrame()để lên lịch kết xuất khung hình đầu tiên cho thiết bị XR. - Nếu cảnh của bạn phức tạp, bạn nên cân nhắc tạo một
Workerhoặc dùng một worker bạn đã tạo trước đó cho mục đích này để thực hiện các phép tính cần thiết cho từng khung hình. Điều này sẽ giảm khả năng quá trình kết xuất làm ứng dụng bị khựng thấy rõ. - Mỗi callback
requestAnimationFrame()nên dùng thông tin về các đối tượng nằm trong thế giới 3D để kết xuất khung hình bằng WebGL. - Mỗi lần callback được gọi, nó nên gọi lại
requestAnimationFrame()để báo cho trình duyệt biết rằng callback cần được chạy lại khi đến lúc kết xuất khung hình tiếp theo.
- Gọi phương thức
-
Khi đến lúc cần dừng (chẳng hạn khi người dùng thoát ứng dụng hoặc rời khỏi trang), hãy kết thúc phiên XR; nếu không, tiếp tục vòng lặp cho đến khi người dùng chọn thoát chế độ XR.
- Để tự kết thúc phiên XR, hãy gọi
XRSession.end(). - Thêm một trình xử lý cho sự kiện
XRSessionendđể được thông báo khi phiên đang kết thúc, bất kể việc kết thúc được khởi tạo bởi mã của bạn, người dùng hay trình duyệt.
- Để tự kết thúc phiên XR, hãy gọi