How to extract 3d model from local machine

I want to load gltf and obj file from local machine and render it on scene

A web application can’t just load files from a local directory. However, you can use the same approach like the three.js editor which is based on the FileReader API.

1 Like
gltfUploader.addEventListener( 'change', async (e) => {

    let file =[ 0 ];
    let reader = new FileReader();

    // This is code that runs after reader.readAsText() finishes
    reader.onload = function ( gltfText ) {

        var loader = new THREE.GLTFLoader();

        loader.parse( gltfText, '', function( gltf ){

          scene.add( gltf.scene );
          renderer.render( scene, camera );

        }, function( errormsg ){
            console.error( errormsg );


    reader.readAsText( file );

i found this solution on stack overflow . but it is not working. please help me out with this
Thank you

What does that mean? Do you get any runtime errors or warnings?

Yes, Error
‘ArrayBuffer’ is not assignable to type ‘string’

That’s how it’s done in the editor:


Now I am able to extract 3d file locally.

Really Helpful

Thank you @prisoner849 and @Mugen87


reader.addEventListener( ‘load’, function ( event ) {

      var contents =;



      var object = new OBJLoader().parse(contents)

       object.parse(contents)      **Error** = filename;


    }, false );

    reader.readAsText( file );

i am able to upload glb file locally but facing problem in parsing obj file please help me with this

Why do you call parse() two times? Try to remove the line object.parse(contents).

Sorry my mistake…
But i corrected code but still facing same issue error.

Error: Argument of type ‘string | ArrayBuffer’ is not assignable to parameter of type ‘string’.

You have to parse the data to JSON before calling ObjectLoader.parse:

var data = JSON.parse( contents );
var object = new OBJLoader().parse( data ) ;

getting same error
Error: Argument of type ‘string | ArrayBuffer’ is not assignable to parameter of type ‘string’.

with JSON.parse(contents)

Then please show with a live example what you are doing. Or share your code as a GitHub repo.

Found solution:
var object = new OBJLoader().parse(contents.toString())