Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Ryan Belshaw-Weir
Ryan Belshaw-Weir
5,721 Points

How to Serve an image - Build a Simple Dynamic Site with Node.js

I need some help. Continuing on with the project by Andrew I am trying to serve up a static image.

This is the code that I have added to the router.js

function getImages(request,response){ const imageType = request.url.slice(-3); if (imageType === "png" || imageType === "jpg") { response.writeHead(200, { 'Content-Type' : 'image/' + imageType}); console.log('Content-Type image/' + imageType); response.write(fs.readFileSync('..' + request.url)); response.end(); } else { response.end(); } }

This is the search.html view.

<img src="/images/VKKm0pn.png" alt="Magnifying Glass" id="searchIcon">

<form action="/" method="POST"> <input type="text" placeholder="Enter a Treehouse username" id="username" name="username"> <input type="submit" value="search" class="button"> </form>

And this is the call in the app.js file.

router.getImages(request,response);

The error that I am getting is:

events.js:160 throw er; // Unhandled 'error' event ^

Error: write after end at ServerResponse.OutgoingMessage.write (_http_outgoing.js:440:15) at Object.view (/Users/ryanbelshaw-weir/projects/treehouse/site/js/render.js:21:14) at Profile.studentProfile.on (/Users/ryanbelshaw-weir/projects/treehouse/site/js/router.js:51:16) at emitOne (events.js:96:13) at Profile.emit (events.js:188:7) at ClientRequest.<anonymous> (/Users/ryanbelshaw-weir/projects/treehouse/site/js/profile.js:24:28) at ClientRequest.g (events.js:292:16) at emitOne (events.js:96:13) at ClientRequest.emit (events.js:188:7) at HTTPParser.parserOnIncomingClient (_http_client.js:474:21)

I have had a look around but I can't seem to find anything that can help. If anyone has any insight that would be great.

2 Answers

Harald N
Harald N
15,843 Points

Hi Ryan Belshaw-Weir.

Your code was hard to read, so next time try to use the 'Markdown Cheatsheet' this formats the code like in a code editor, and makes it easier for everyone to see all the indents etc :D

I'm not sure what the problem is, but I would recommend to look at the fs.readFileSync.

fs.readFileSync('..' + request.url);

The double period point, signals the file system module from node to go out of the current folder that this file is in. And if request.url doesn't contain a '/' it will give an error since there is no file named ..+request.url. Also check that the content of request.url == the expected string, so it will point in the right file.

So this MAY fix the problem

fs.readFileSync('../' + request.url);

Hopes this helps a bit.

Ryan Belshaw-Weir
Ryan Belshaw-Weir
5,721 Points

HI Harald,

Thanks for the info on the markdown, I couldn't figure out how everyone was able to post code all nice and formatted.

var markdown = "Nicely formatted code :)";

I updated the code to include the "/" but I am still getting the same error. After some Googling I'm still none the wiser.