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 trialAmani Wainaina
6,722 PointsERR_TOO_MANY_REDIRECTS
Hi, I am getting an error when I try visiting http://localhost:3000. I am getting this error...
This page isnβt working localhost redirected you too many times. Try clearing your cookies. ERR_TOO_MANY_REDIRECTS crbug/1173575, non-JS module files deprecated.
How can I fix this? Any help would be appreciated.
14 Answers
Rohald van Merode
Treehouse StaffHi Amani Wainaina,
You're getting very close to get this working! π₯ There's 2 issues stopping your app from running. On line 3 of your /routes/cards.js
file you're trying to import the json file from the root of your project while this file is currently located in the routes
directory instead.
To fix this module not found error you'll want to change the import on line 3 from this:
const { data } = require('../data/flashcardData.json')
to this:
const { data } = require('./data/flashcardData.json')
After that change there's one more error being thrown when visiting localhost:3000
which is caused by line 9 of your /routes/index.js
file where you're looking for the view /home
while that pug file is called home
. If you remove that /
the view will be rendered to the screen and your app will start working as expected π
Hope this helps π
Julie Branyan
Full Stack JavaScript Techdegree Graduate 16,337 PointsHi Amani - would you be able to post your code? That will better help troubleshoot the issue.
Amani Wainaina
6,722 PointsThis is the code I have in my app.js file.
const express = require('express');
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const { name } = require('pug/lib');
const app = express();
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());
app.use('/static', express.static('public'));
app.set('view engine', 'pug');
const mainRoutes = require('./routes');
const cardRoutes = require('./routes.cards');
app.use(mainRoutes);
app.use('/cards', cardRoutes);
app.use(( req, res, next) => {
console.log('Hello');
const err = new Error('Oh noes!');
err.status = 500;
next();
});
app.use((req, res, next) => {
console.log('world');
next();
});
app.use((req, res, next) => {
const err = new Error('Not Found');
err.status = 404;
next(err);
})
app.use((err, req, res, next) => {
res.locals.error = err;
res.status(err.status);
res.render('error');
})
app.listen(3000, () => {
console.log('The application is running on localhost: 3000');
});
Julie Branyan
Full Stack JavaScript Techdegree Graduate 16,337 PointsHi Amani,
I reviewed the code and identified two items. First on the variable cardRoutes, in the route there is a period instead of a / in the route, const cardRoutes = require('./routes/cards'). Second, where the error is being thrown, the next() function, should pass err into the function, next(err). I updated your code with these items and it worked when I tested it. If you are using nodemon in the terminal, when you save it should throw errors in the console to help determine where the error is located. This is what I used to narrow it down. Hope this fixes it!
const express = require('express');
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const { name } = require('pug/lib');
const app = express();
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());
app.use('/static', express.static('public'));
app.set('view engine', 'pug');
const mainRoutes = require('./routes');
const cardRoutes = require('./routes/cards');
app.use(mainRoutes); app.use('/cards', cardRoutes);
app.use(( req, res, next) => { console.log('Hello');
const err = new Error('Oh noes!');
err.status = 500;
next(err); });
app.use((req, res, next) => { console.log('world'); next(); });
app.use((req, res, next) => { const err = new Error('Not Found'); err.status = 404; next(err); })
app.use((err, req, res, next) => { res.locals.error = err; res.status(err.status); res.render('error'); })
app.listen(3000, () => { console.log('The application is running on localhost: 3000'); });
Amani Wainaina
6,722 PointsHi Julie,
Thank you for pointing out those errors. I was able to make the changes, but now I am getting a...
RangeError [ERR_HTTP_INVALID_STATUS_CODE]: Invalid status code: undefined
I am not sure why I am getting this error.
Julie Branyan
Full Stack JavaScript Techdegree Graduate 16,337 PointsIf I remember the videos correctly, I think you were supposed to comment out the 500 error before moving onto the 404. My guess is one of these is causing the issue, but I wasn't able to recreate it. This treehouse thread there was another user with the RangeError and that's what they did. https://teamtreehouse.com/community/express-handling-404-errors-404-middleware-not-working. Thomas's comment is the one I'm referring to. Let me know if this fixes it.
Amani Wainaina
6,722 PointsI commented out the 500 error and I tried what was in Thomas's comment but I am still getting the ....
RangeError [ERR_HTTP_INVALID_STATUS_CODE]: Invalid status code: undefined at new NodeError (node:internal/errors:371:5) at ServerResponse.writeHead (node:http_server:274:11) at ServerResponse._implicitHeader (node:_http_server:265:8) at write (node:http_outgoing:766:9) at ServerResponse.end (node:_http_outgoing:855:5) at ServerResponse.send (C:\Users\Amani\flashcards\node_modules\express\lib\response.js:221:10) at done (C:\Users\Amani\flashcards\node_modules\express\lib\response.js:1013:10) at Object.exports.renderFile (C:\Users\Amani\flashcards\node_modules\pug\lib\index.js:448:12) at View.exports._express [as engine] (C:\Users\Amani\flashcards\node_modules\pug\lib\index.js:493:11) at View.render (C:\Users\Amani\flashcards\node_modules\express\lib\view.js:135:8)
Rohald van Merode
Treehouse StaffHi Amani Wainaina π
I'm unable to replicate the error you're getting on my end. The only thing I can think of is that the status code is not coming through correctly in your last middleware. I'd suggest to set the err.status
to have a default value by changing your code from this:
app.use((err, req, res, next) => {
res.locals.error = err;
res.status(err.status);
res.render('error');
})
To this:
app.use((err, req, res, next) => {
res.locals.error = err;
const status = err.status || 500;
res.status(status);
res.render('error');
})
This way your status will be set to the err.status
if that is being passed through and otherwise fall back to the 500
status code.
Hope that will fix your issue, if not please share your code as it is now (after the changes suggested by Julie) and I'd be happy to have another look π
Amani Wainaina
6,722 PointsHi,
I made the changes to the err.status and I am still getting an error. This is the error I am getting now.....
node:internal/modules/cjs/loader:936 throw err; ^
Error: Cannot find module '../data/flashcardData.json' Require stack:
- C:\Users\Amani\flashcards\routes\cards.js
- C:\Users\Amani\flashcards\app.js at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15) at Function.Module._load (node:internal/modules/cjs/loader:778:27) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at Object.<anonymous> (C:\Users\Amani\flashcards\routes\cards.js:3:18) at Module._compile (node:internal/modules/cjs/loader:1101:14) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\Users\Amani\flashcards\routes\cards.js', 'C:\Users\Amani\flashcards\app.js' ] }
Amani Wainaina
6,722 PointsThis is my app.js code....
const express = require('express');
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const { name } = require('pug/lib');
const app = express();
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());
app.use('/static', express.static('public'));
app.set('view engine', 'pug');
const mainRoutes = require('./routes');
const cardRoutes = require('./routes/cards');
app.use(mainRoutes);
app.use('/cards', cardRoutes);
app.use((req, res, next) => {
const err = new Error('Not Found');
err.status = 404;
next(err);
});
app.use((err, req, res, next) => {
res.locals.error = err;
const status = err.status || 500;
res.status(status);
res.render('error');
})
app.listen(3000, () => {
console.log('The application is running on localhost: 3000');
});
Amani Wainaina
6,722 PointsHere is also a link to the whole project file on GitHub...
Rohald van Merode
Treehouse StaffHi Amani Wainaina π
The code you've shared from the app.js
looks good to me at first sight. Looks like the error is coming from your /routes/cards.js
file where you're importing the json data. You'll want to make sure that the filepath is correct and the file itself is located in the data
folder in the root of your project.
I wanted to have a look at your entire project but the visibility of the Github repo you've shared seems to be set to private as I'm getting a 404 error. Please change the visibility to public and I'd be happy to have another look π
Amani Wainaina
6,722 PointsThank you so much! It is now working.