XMLHttpRequest not defined when using JSONLoader in Node

Question

I'm writing a game in Three.js, and as a multiplayer game, I need to verify client positions serverside to prevent cheating. I'm currently trying to load a model on the server, as such:

var THREE = require("three");
var loader = new THREE.JSONLoader();
loader.load( './models/tree.json', function ( geometry, materials ) {
    var mesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial( materials ) );
    res.send(mesh);
});

However, the server dies and spits out

var request = new XMLHttpRequest();
ReferenceError: XMLHttpRequest is not defined
    at FileLoader.load

This request is coming at node_modules\three\build\three.js:29258, where an XMLHttpRequest is made.

Why is this happening? Am I doing something wrong, or is this portion of Three.js broken for Node?

Andrew Li · Accepted Answer · 2017-02-25 19:16:56Z

10

Three.js uses an XMLHttpRequest to load files such as your JSON file. XMLHttpRequest is built-in in browsers environments, but it's not built-in in a Node environment, so it's not defined, thus the error. You'll have to install the xmlhttprequest package through NPM to use it with Node.

Since Three.js does not require the xmlhttprequest module, you're going to have to set a global variable so that new XMLHttpRequest will work:

global.XMLHttpRequest = require("xmlhttprequest");

edited Feb 25, 2017 at 19:16

answered Feb 25, 2017 at 18:44

Andrew Li

58.1k14 gold badges135 silver badges150 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

robe007 Over a year ago

I have posted an answer about why to not use in all cases the xmlhttprequest module. You should check it out.

Collectives™ on Stack Overflow

XMLHttpRequest not defined when using JSONLoader in Node

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related