使用 React-三纤维解析模型

Question

react- Three-Fiber 提供 useLoader 来加载模型。 示例展示了如何从路径/url加载模型。我已将模型的二进制表示形式保存在浏览器的 IndexDB 中。

我添加了这个沙箱。它显示了如何通过路径/URL 加载模型（如文档中所述）。它还显示了我需要如何将二进制文件从 localStorage 读取到 binaryFromLocalStorage 中。

我将如何使用react-三纤维加载/解析binaryFromLocalStorage？

Answer 1

LocalStorage只能存储字符串。

因此，

const reader = new FileReader();

reader.onload = (event) => {
  localStorage.setItem("file", event.target.result);
}

reader.readAsDataURL(blob);

读取

dataURItoBlob(localStorage.getItem("file")) // Blob

将二进制文件保存到 localStorage 可能非常不稳定，因为 localStorage 只有 5MB，并且不同的浏览器有不同的限制。

您可能想改用indexDB。

您可以选择使用localForage，它提供了localStorage的API接口