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

Question

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

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

[编辑] 加入溶液

Answer 1

这是我自己的问题的解决方案。根据场景及其对象的大小，可能需要一些时间。在我的情况下，我想返回相当小的对象版本，但仍需要大约400毫秒才能响应400x400px 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); 

Answer 2

你可以尝试headless-gl但你需要使用一些其他库效仿DOM和图像标签（纹理加载）和Canvas标签和/或Canvas2D，如果您需要也是如此。

否则，你也许可以shell to a browser running on top of OSMESA或尝试headless chromium