使用 Three.js 載入本機檔案時如何修復「僅支援 HTTP 的跨來源請求」錯誤？

使用Three.js 載入本地檔案：跨來源請求故障排除

嘗試使用JSONLoader 將本地3D 模型載入到Three.js 時，您可能會遇到「僅HTTP 支援跨來源請求」。錯誤。此錯誤是由於您的本機檔案和網路瀏覽器之間的協定不同而導致的。

錯誤原因

出現此錯誤是因為瀏覽器限制跨來源請求預設。出於安全原因，它們阻止網站訪問來自不同來源的資源。從您的電腦載入本機檔案時，瀏覽器會認為它具有與您的網站不同的來源，而您的網站通常透過 HTTP 提供服務。

修正錯誤

要解決此錯誤，您有兩個選擇：

1. 安裝本地Web Web ：

   • 在本機上安裝Web伺服器，例如 XAMPP 或 Apache，並在伺服器上託管 3D 模型。
   • 將 JSONLoader 的 URL 變更為您的模型的路徑webserver。

2. 遠端上傳模型：

   • 將您的3D 模型上傳到遠端伺服器，例如GitHub， AWS S3，或免費託管服務。
   • 將 JSONLoader 的 URL 更新為遠端 URL。

了解來源

來源定義為方案、主機和連接埠的組合。在這種情況下，方案（HTTP/檔案）、主機（localhost）和連接埠（通常為 80）不同。正如 RFC-6454 所述：「...它們具有相同的方案、主機和連接埠。」因此，即使檔案來自同一主機，但不同的方案會導致不同的來源。

遵循這些解決方案，您可以成功地將本機 3D 模型載入到 Three.js 中，並避免「跨來源請求」僅支援 HTTP。 」錯誤。

以上是使用 Three.js 載入本機檔案時如何修復「僅支援 HTTP 的跨來源請求」錯誤？的詳細內容。更多資訊請關注PHP中文網其他相關文章！