Forum Discussion

🚨 This forum is archived and read-only. To submit a forum post, please visit our new Developer Forum. 🚨
fornaeffe's avatar
fornaeffe
Honored Guest
2 years ago

Meta Quest Browser file input fails with some file extensions

While developing a web app with three.js, I noticed an unexpected behavior of Meta Quest Browser:

  • if I choose a .glb model file with a <input type="file"> tag, and try to access it in javascript, the browser does not allow access to the file
  • if I manually change the extension to .png, it works.

Disabling safe navigation in browser's settings does not solve the problem.

The problem occur only on Meta Quest Browser: Chrome on Windows and Android behave as expected.

This is the code handling file input:

 

 

const fileInput = document.getElementById('file') as HTMLInputElement
fileInput.addEventListener('change', (e) => loadModel((e.target as HTMLInputElement).files![0]))
function loadModel(file: File) {
    const url = URL.createObjectURL(file)

    const loader = new GLTFLoader()
    
    loader.load( url, function ( gltf ) {
        scene.add( gltf.scene );
        console.log('Model loaded')

    }, undefined, function ( error ) {

        console.error( error );

    } );
}

 

 

And this is the console error I get when accessing file with .glb extension

 

 

GET blob:https://192.168.1.161:5500/83bfd355-2cf6-4714-bda7-3c6cf3331c58 
net::ERR_ACCESS_DENIED 200 (OK)
load    @   three.module.js:41933
load    @   GLTFLoader.js:222
loadModel   @   index.ts:58
(anonymous) @   index.ts:52

Uncaught (in promise) TypeError: network error
Promise.then (async)        
readData    @   three.module.js:41973
start   @   three.module.js:41969
(anonymous) @   three.module.js:41966
Promise.then (async)        
load    @   three.module.js:41934
load    @   GLTFLoader.js:222
loadModel   @   index.ts:58
(anonymous) @   index.ts:52

 

 

I set up a sample web app to reproduce the problem:

https://fornaeffe.github.io/vr-playground/

source code here:

https://github.com/fornaeffe/vr-playground/tree/visorr-upload-bug

 

Other details of the problem explained here: https://stackoverflow.com/questions/77068404/model-loaders-work-in-chrome-but-not-in-meta-quest-2-browser-when-using-file-in

and here: https://discourse.threejs.org/t/gltfloader-works-in-chrome-but-not-in-meta-quest-2-browser/55803

 

 

 

 

 

1 Reply

  • domistep's avatar
    domistep
    Honored Guest

    Exactly the same problem - FileReader not able to open .json file from Download folder (selected by user in <input>), but when I add .png - voala, file working as expected, the JS code working well in Google Chrome (Windows, Android, macOS), but in Oculus Browser seems file extensions like .json or .txt not working, no error, only FileReader output null instead of data