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

Question

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

是否可以做到这一点？在这种情况下，方法是什么？是否可以将 moch-browser 与 node-gl 或其他东西结合使用？

[编辑] 添加解决方案

Answer 1

这是我自己解决问题的方法。根据场景及其对象的大小，可能需要一些时间。就我而言，我想返回该对象的非常小的版本，但仍然需要大约 400 毫秒才能响应 400x400px png。希望这对那里的人有帮助！

服务器.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);