Node.js - sending files to client using sendFile

Question

I am very new to Node.js and have been following a game-making tutorial, found here: http://rawkes.com/articles/creating-a-real-time-multiplayer-game-with-websockets-and-node.html

I am trying to improve on the game detailed in the tutorial by sending all the necessary files to the client.

When I connect to my server as a client, this error is thrown in the server terminal,

_http_outgoing.js:344
    throw new Error('Can\'t set headers after they are sent.');
    ^

Error: Can't set headers after they are sent.
    at ServerResponse.OutgoingMessage.setHeader (_http_outgoing.js:344:11)
    at Array.write (/Users/Mark/node_modules/express/node_modules/finalhandler/index.js:164:9)
    at listener (/Users/Mark/node_modules/express/node_modules/on-finished/index.js:169:15)
    at onFinish (/Users/Mark/node_modules/express/node_modules/on-finished/index.js:100:5)
    at callback (/Users/Mark/node_modules/express/node_modules/on-finished/node_modules/ee-first/index.js:55:10)
    at IncomingMessage.onevent (/Users/Mark/node_modules/express/node_modules/on-finished/node_modules/ee-first/index.js:93:5)
    at emitNone (events.js:67:13)
    at IncomingMessage.emit (events.js:166:7)
    at endReadableNT (_stream_readable.js:921:12)
    at nextTickCallbackWith2Args (node.js:442:9)

Here is the offending code:

var util = require("util"),
    Player = require("./Player").Player;

var app = require('express')();
var http = require('http');
var httpServer = http.createServer(app);
httpServer.listen(8000)
var io = require('socket.io');


var socket,
    players;
app.get('/', function(req, res){
  res.sendFile(__dirname + '/public/index.html');
  res.sendFile(__dirname + '/public/js/game.js');
  res.sendFile(__dirname + '/public/js/Keys.js');
  res.sendFile(__dirname + '/public/js/Player.js');
  res.sendFile(__dirname + '/public/js/requestAnimationFrame.js');
  res.sendFile(__dirname + '/public/style/game.css');
  res.sendFile(__dirname + '/public/style/reset.css');
});
function init() {
    players = [];
    socket = io.listen(httpServer)
   
    //streamline
    socket.configure(function() {
    socket.set("transports", ["websocket"]);
    socket.set("log level", 2);
});
    
    
    setEventHandlers()
    
}


init()

Any suggestions on getting this code working would be highly appreciated. I'm sure the solution is obvious but nothing I could find seemed to work.

One request sends one file. You can't call res.sendFile() multiple times. The client will request the other files and you create routes for them in your express app so when the client requests them, you will send the appropriate file matching the desired request. You can use express.static() to set up route handling for all your static files with one line of code. — jfriend00
– jfriend00, Commented Oct 8, 2016 at 17:53
@jfriend00 Can you post it as an answer? It is the right answer to the question. — Guido
– Guido, Commented Oct 8, 2016 at 18:02
Thanks four your help! I think i've got it implemented correctly, but now i'm getting a new error, the client can't seem to find my socket.io.js file on the server. I think I have it installed correctly. I have a file called node-modules in my server file with socket.io installed in it. Chrome is throwing this error: GET localhost:8000/socket.io/socket.io.js I tried pointing the index.html page directly at the socket.io.js file within node-modules but the same error is returned. — Boi
– Boi, Commented Oct 9, 2016 at 10:05

jfriend00 · Accepted Answer · 2016-10-08 18:12:41Z

1

One request sends one file. You can't call res.sendFile() multiple times for the same request (nor should you). If this is an HTML page that is being requested with <script> tags and <style> tags in it, then the browser will request the other files specified by those tags with separate requests. You create routes for them in your express app so when the client requests them, you will send the appropriate file matching those desired requests.

You can use express.static() to set up route handling for all your static files with one line of code.

But, the key here is that app.get('/') is a route handler only for the HTML of the page. The browser will then request the other resources in that page and you need routes for those resources too. You don't just send multiple files upon one request.

answered Oct 8, 2016 at 18:12

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

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

Comments

Onkar Dighe · Accepted Answer · 2023-07-21 05:58:18Z

1

res.sendFile() is used to send the file located at the specified path to the client.

A single HTTP GET request can only have one response. In Express, the res.send() or res.sendFile() method is used to send a response back to the client. Once the response is sent, the request-response cycle is complete.
You cannot use both at a time.
Try using express.static() to access these files statically by passing their relative path

answered Jul 21, 2023 at 5:58

Onkar Dighe

176 bronze badges

Collectives™ on Stack Overflow

Node.js - sending files to client using sendFile

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related