Question

我使用的是OBJ格式，但OBJ太重了，无法下载，因此，我想在Zip中上传OBJ文件，然后，查看器将其解压缩并调用函数OBJLoader。你知道最好的方法是什么吗？谢谢，拉法

Answer 1

问题解决了：

1）将jszip脚本添加到您的页面 2）转到OBJMTLLoader.js（关于第33行）并放置这10行来解压缩zip（假设file.zip只包含file.obj）在loader.load函数中

loader.load( url, function ( text ) { 


                if (url.split('/').pop().split('.')[1] == 'zip'){
                //- Uncompress url e.g.  http:// .... / PTERO.zip -> PTERO.obj -

                    // zip should contain only one file !

                    // uncompression object
                    var new_zip = new JSZip(); 

                    // uncompress
                    new_zip.load(text);

                    // the single file name convention
                    filename = url.split('/').pop().split('.')[0] + ".obj";

                    // get the file content as text
                    text = new_zip.file(filename).asText();
                }
                //--------------------------------------------

                var object = scope.parse( text );

3）在Three.js的XHRLoader中添加这两行，以便在扩展名为zip时加载二进制文件：

 THREE.XHRLoader.prototype = {

    constructor: THREE.XHRLoader,

    load: function ( url, onLoad, onProgress, onError ) {

        var scope = this;

        var cached = scope.cache.get( url );

        if ( cached !== undefined ) {

            if ( onLoad ) onLoad( cached );
            return;

        }

        var request = new XMLHttpRequest();
        request.open( 'GET', url, true );


        // ----------  for zipped obj ------------
        if ( url.split('.').pop() == 'zip')
            request.responseType = "arraybuffer";
        //--------------------------------------

        request.addEventListener( 'load', function ( event ) {

        scope.cache.add( url, this.response );

        ...

Answer 2

除了最好的解决方案之外，您无法将缓冲区传递给加载程序而不是URL，这是毫无意义的。我也需要它，所以我使用了@jimver的答案，但更改了STLLoader.js方法，因为它们已被弃用。改为使用它（在我的情况下，我在文件THREE.STLLoader.prototype = { constructor: THREE.STLLoader, load: function ( url, onLoad, onProgress, onError ) { var scope = this; var loader = new THREE.XHRLoader( scope.manager ); loader.setResponseType( 'arraybuffer' ); loader.load( url, function ( text ) { if (url.split('/').pop().split('.')[1] == 'zip') { JSZip.loadAsync(text) .then(function (zip) { return zip.file(Object.keys(zip.files)[0]).async("arrayBuffer"); }) .then(function success(text) { onLoad( scope.parse( text ) ); }, function error(e) { console.log(e); }); } else { onLoad( scope.parse( text ) ); } }, onProgress, onError ); }, // rest of the code上进行了更改，因为我正在使用STL文件，但这适用于任何加载器）：

Key

Answer 3

如果你真的想在浏览器中使用zip，

我认为您可以使用zip.js解压缩下载的文件，并使用OLBJLoader.parse解析结果。

Answer 4

我会尝试使用jszip

JSZipUtils.getBinaryContent('path/to/objzipped.zip', function(err, data) { 
  if(err) {
    throw err; // or handle err
  }
  var zip = new JSZip(data);
  var objData = zip.file("objfile.obj").asText();
  var object3D = new OBJLoader().parse(objData); // ...
});

Answer 5

解码gzip内置于浏览器中。您根本不需要任何客户端代码。您需要做的就是确保服务器正在设置正确的MIME类型。请参阅：What 'Content-Type' header to use when serving gzipped files?

导入Zip文件

5 个答案: