中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

蘋果公司正在擴展其在XR領域的足跡，比如最近從WebXR挖來的高管，就為Vision Pro平臺帶來了新的可能性。

在筆者上一篇硬件評測的文章《【評測】Vision Pro新伴侶，國產消費級8K相機—影石Insta360 X4》中，展示了通過Apple Vsion Pro 體驗 Insta360 X4 拍攝的 360° 全景照片和全景視頻。

全新的計算平臺上，單眼 4K 的魅力再次被展示得淋漓盡致，特別是超高分辨率全景照片的演示下，盡顯科技感，可以說是“空間影像”的另類補充。

圖源：VR陀螺

接下來，跟隨筆者的腳步，我們一同解鎖 Vision Pro 上的 WebXR 功能，并基于相關項目在云端部署 360° 全景內容，以及背后更多的開發故事。

一、蘋果支持WebXR，2022年就已埋下伏筆

在教程開啟前，我們再來重溫一下 WebXR 的相關知識。

WebXR 是一種適用于網絡瀏覽器的標準化 API，使得開發者能夠在網頁上構建 XR 內容，無需用戶安裝專門的應用程序。WebXR 由 W3C 的 Immersive Web Group 定義，它統一了以往的 WebVR 標準，并加入了對增強現實的支持，因此能夠服務于更廣泛的 XR 應用場景。

圖源：網絡

通過 WebXR，開發者可以利用網頁技術（如 JavaScript）創建應用，這些應用能夠運行在各種支持 WebXR 的設備上，包括 VR 頭戴設備、支持 AR 的智能手機、平板電腦等。用戶可以使用 VR/MR 設備，通過瀏覽器訪問的形式，直接體驗沉浸式的 XR 內容。

從開發層面看，WebXR 降低 XR 內容的開發門檻，更開放的瀏覽器形式的訪問，也推動內容生態的多樣化和繁榮，同時為用戶提供簡單易得的沉浸式內容訪問途徑。在 XR 產業發展的早期階段，WebXR 提供了強大的開發支持，大量的全景照片、全景視頻網頁內容也應運而生。

Immersive Web Group 的主席有三位，分別是三星的 Ada Rose Cannon、微軟的 Ay?egül Y?net 和谷歌的 Chris Wilson。2022 年，Cannon 在社交平臺上宣布她已加入蘋果公司，并在該公司從事 AR/VR 方面的工作——這為后來在蘋果Vision Pro 在 Safari 上支持 WebXR 其實埋下了伏筆。

圖源：網絡

二、打開VisionOS中的WebXR功能

VisionOS 中的 Safari 瀏覽器現已支持 WebXR，但必須進行一些設置才能使其正常工作。

如何在 Safari 中為 Apple Vision Pro 啟用 WebXR 步驟：

1.打開設置。

2.選擇應用程序。

3.選擇Safari。

圖源：網絡

4.滾動到窗口底部并選擇高級。

5.滾動到窗口底部并選擇功能標志。

6.在實驗性 XR 功能下，啟用WebXR 設備 API和WebXR 手寫輸入模塊。

7.在 WebKit 功能標志下，啟用WebXR 增強現實模塊、WebXR GamePads 模塊、GPU 進程：DOM 渲染。

圖源：網絡

8.退出設置。

9.打開Safari，或者如果它已打開，請刷新啟用WebXR 的頁面以檢查其是否正常工作。

10.由于 Apple Vision Pro 不使用控制器，因此只能使用手部追蹤的演示和體驗才能在頭顯上正常工作。

測試：在 Safari 里面打開 https://hughred22.github.io/360Viewer3/(原博主項目地址，由于鏈接太長，用戶可通過備忘錄或txt的方式隔空到Vision Pro中打開)，然后點擊右下角的“頭顯標識”測試，查看是否可以正常打開“全景模式”使用。

以上教程內容，以及項目源代碼來自 YouTube 博主 Hugh Hou，項目源代碼已被上傳到 Github：https://github.com/hughred22/360Viewer3。

三、通過Github項目，構建WebXR應用

基于該 Github 項目，有一定動手能力的朋友們甚至可以自己打造一個 WebXR 項目。

準備：一臺服務器/云服務器，環境：支持 ES6 的 Node.js 版本

1.將項目壓縮包上傳到服務器指定目錄后解壓，或使用 git 命令一鍵獲?。?/p>

git clone https://github.com/hughred22/360Viewer3.git

br

2.運行在項目的 package.json 文件中定義的 build 腳本：

#如果沒有進入項目目錄，則需要先項目所在目錄：

cd /www/wwwroot/vision

npm run build

3.運行結果如下，那就是成功了，在該項目目錄下會生成靜態文件/dist/。（圖中npm版本（10.5.0）與Node.js 版本（17.9.1）不兼容導致的警告，這里是筆者個例服務器環境配置問題，可忽略掉）

圖源：VR陀螺

4.最后，可以采用端口映射、或域名映射的方式添加/路徑/dist/。這樣就可以通過域名，或者服務器+端口的形式在 Vision Pro 中直接訪問使用了。如果想更換相關全景照片、全景視頻資源，可以在 assets 文件下，替換相關圖像視頻內容，再進行 build。

5.最終結果展示：

圖源：VR陀螺

以上項目代碼及教程內容僅供學習參考，版權歸屬于原作者所有。

當然，如果你是一名專業的開發者，那么你也可以借助 WebXR 打造自己獨特的應用程序。不過相對于原有的 WebXR 項目構建，要想在 Vision Pro 上可以使用，那可能有一些不同。

四、VisionOS中與眾不同的WebXR

事實上，在 Vision Pro 上開發一個 WebXR 的應用程序并不簡單。

Ada Rose Cannon 與 Brandel Zachernuk 在今年 3 月份發表在 Webkit 的一篇文章《Apple Vision Pro 中引入 WebXR 自然輸入》中指出：Vision Pro 上運行 WebXR 項目的一個挑戰是因為它是完全沉浸式的，并且完全通過 WebGL 渲染，所以不可能通過 DOM 內容或通過鼠標、觸控板等在傳統網頁上提供的二維輸入來提供交互。

眾所周知，VisionOS 主要依賴眼動追蹤與手勢識別。而 WebXR 的初始網絡標準是假設所有輸入都將由硬件控制器提供。由于 VisionOS 的自然輸入交互與依賴于監聽物理控制器和按鈕按下的 XR 平臺不同，因此許多現有的 WebXR 體驗在 Apple Vision Pro 上無法按預期運行。

其在文中寫道：我們（蘋果）一直在 W3C 中合作，將對 VisionOS 交互模型的支持納入到 WebXR 中，我們很高興能夠幫助 WebXR 社區添加對流行 WebXR 框架的支持。

蘋果主要針對了 Vision Pro 上WebXR 在使用自然輸入交互、持續互動、將瞬態輸入與手部追蹤相結合等幾個模塊進行了開發側講解。

1. 自然輸入交互

由于 VisionOS 中的 WebXR 需要使用空間輸入，而不是觸控板、觸摸或鼠標，并且 DOM 在 WebXR 會話中不可見，因此輸入作為 XRSession 本身的一部分提供。與輸入相關的事件，例如select，selectstart然后selectend從會話對象中調度。

XRInputSources 在xrSession.inputSources數組中可用。由于 VisionOS 中的默認 WebXR 輸入是瞬態的，因此該數組為空 – 直到用戶捏住為止。此時，一個新輸入將添加到數組中，并且會話將觸發一個inputsourceschange事件，然后觸發一個selectstart事件。您可以使用它們來檢測手勢的開始。為了區分這種新的輸入類型，它有一個 transient-pointer的 targetRayMode。

圖源：網絡

2. 手、眼、指針的互動

XRInputSource包含對與輸入相關的空間中兩個不同位置的引用：the targetRaySpace和 the gripSpace。targetRaySpace表示用戶的注視方向，該空間從用戶眼睛之間的原點開始，并指向用戶在手勢開始時所注視的內容。targetRaySpace最初設置為用戶注視的方向，但隨著用戶手的移動而不是眼睛的移動而更新，也就是說，手向左移動時，該指針也會向左移動，gripSpace表示當前時間點用戶捏合手指的位置。

targetRaySpace可以用于查找用戶在開始手勢時想要交互的內容，通常通過指針投射到場景中并拾取相交的對象，并且gripSpace可用于用戶手附近的對象的定位和方向以實現交互目的，例如，按下開關、轉動旋鈕或從虛擬環境中拾取物品。

互動結束：session當用戶松開捏合時，對象會觸發三個事件。

圖源：網絡

3. 將瞬態輸入與手部追蹤相結合

VisionOS 中 Safari 上的 WebXR 也繼續支持全手部跟蹤，在體驗期間提供手部關節信息。如果調用navigator.xr.requestSession已 hand-tracking作為附加功能包含在內，并且這是由用戶授予的，則inputSources列表中的前兩個輸入將是tracked-pointers提供此聯合信息的標準輸入。由于這些輸入在會話期間持續存在，因此任何transient-pointer輸入都將顯示在列表的下方。手部輸入僅提供姿勢信息，不會觸發任何事件。

可以看到 Vision Pro 上關于 WebXR 的開發設計，主要的是解決人機交互上的問題。因為 Vision Pro 上獨特的眼動追蹤與手勢交互特性，讓開發者不得不做出更多的調整，以適應蘋果的交互規則。

一個不得不思考的問題是，當大部分開發者都涌入 APP 生態開發時，還有多少開發者會開發 WebXR 的項目，他們的用戶價值和商業價值又在哪里？

當然，存在即合理。也許基于 WebXR 開發者們可能的確會有一些非 APP 形式特定的場景內容，想要在瀏覽器中去展示，而不是受限于各種規則與審核的傳統 APP，它們將擁有更高的自由度。

參考鏈接：

基于Vision Pro的360度全景內容項目參考來源：https://www.youtube.com/watch?v=76fcXzXWk2c&t=200s

更多 Vision Pro WebXR 開發細節可參考：https://webkit.org/blog/15162/introducing-natural-input-for-webxr-in-apple-vision-pro/