javascript - 是否可以在 node.js 服务器上运行 Three.js WebGLRenderer？

Question

我需要在服务器上运行 WebGLRenderer，但对此有不同的声音。有人说这是不可能的，有人说他们正在尝试让它发挥作用，但那是讨论结束的时候。

是否可以这样做，在那种情况下，方法是什么？是否可以结合使用 moch-browser 和 node-gl 之类的东西？

[编辑]添加解决方案

Answer 1

这是我自己解决问题的方法。根据场景及其对象的大小，这可能需要一些时间。在我的例子中，我想返回非常小的对象版本，但仍然需要大约 400 毫秒来响应 400x400 像素的 png。希望这对外面的人有帮助!

Server.js

var THREE = require("three.js");

// Create a DOM
var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser();
var document = MockBrowser.createDocument();
var window = MockBrowser.createWindow();

//REST API
var express     = require('express');      
var app         = express();    
var bodyParser  = require('body-parser');
var router = express.Router();

var gl = require('gl')(1,1); //headless-gl

var pngStream = require('three-png-stream');
var port = process.env.PORT || 8080;

router.get('/render', function(req, res){

    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(75, this.width / this.height, 0.1, 1000);
    var renderer = new THREE.WebGLRenderer({context:gl});

    scene.add(camera);

    renderer.setSize(this.width, this.height);
    renderer.setClearColor(0xFFFFFF, 1);

    /*...
        Add your objects & light to the scene 
    ...*/

    var target = new THREE.WebGLRenderTarget(this.width, this.height);
    renderer.render(scene, camera, target);


   res.setHeader('Content-Type', 'image/png');
   pngStream(renderer, target).pipe(res);
});

app.use('/api', router);

app.listen(port);
console.log('Server active on port: ' + port);