How to add a new Node.js route with app.use [duplicate] - node.js

I would like to understand the order precedence in express.js. For example, as bellow code
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/api', api);
app.use('/users', users);
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});
If a request come from client localhost:3000/api/abc and localhost:3000/user/abc, the response from api and user module. But if I make a request like localhost:3000/myName/xyz, the app module return a response. This behavior let me concern about what is precedence of expressjs and what is correct order for router modules. Why routers do not confuse between actions "api", "users" and parameter ":name". Please let me understand clearly how express does and what is precedence.

The order is first come first serve.
In your case, if user hits /api, he will get response from api, but if you write /:name route before /api, /:name will serve for /api requests also.
Case1: /api will serve requests for /api.
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/api', api);
app.use('/users', users);
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});
Case2: /:name serves requests for /api and /users
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/api', api);
app.use('/users', users);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});

The example given in the ExpressJS documentation is pretty simple and was unfortunately difficult to find. I only found it through another SO question.
Middleware functions are executed sequentially, therefore the order of middleware inclusion is important
app.use(function(req, res, next) {
res.send('This is the only thing that ever happens')
}
app.use(...) // never used
app.get(...) // never used
app.put(...) // never used
app.post(...) // never used

Related

How to prevent response from server directly display in browser?

I am using express.js framework for my node.js server.
This is how I setup my server.
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var createUsers = require('./routes/users/createUsers');
var updateUsers = require('./routes/users/updateUsers');
var deleteUsers = require('./routes/users/deleteUsers');
var readUsers = require('./routes/users/readUsers');
var app = express();
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
var mysql = require("mysql");
//Database connection
app.use(function(req, res, next){
res.locals.connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : 'password',
database : 'project'
});
res.locals.connection.connect();
next();
});
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', index);
app.use('/createUsers', createUsers);
app.use('/updateUsers', updateUsers);
app.use('/deleteUsers', deleteUsers);
app.use('/readUsers', readUsers);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error.ejs');
});
var http = require('http');
module.exports = app;
var server = http.createServer(app);
server.listen(4000);
This is my readUsers.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
//console.log("pending data");
res.locals.connection.query('SELECT id,name,email,username,address,phone,status FROM user', function (error, results, fields) {
if (error) throw error;
res.send(JSON.stringify(results));
});
});
module.exports = router;
My server is listen at port 4000. My react frontend componentDidMount() function use axios.get("http://localhost:4000/readUsers") to read the data from database and it worked well.
However, if I directly type in http://localhost:4000/readUsers in my browser, it will directly connect to my database and read all User data and displayed the data in browser. This is not I want because everyone can read my data if they know this address. Any way to prevent this issue?
Add middleware to your router. here's the doc Router-level middleware
Express have many middleware, one of it is route-level middleware. This middleware handle anything between users and your function.
Here is the example i fetch from the documentation.
var app = express()
var router = express.Router()
// a middleware function with no mount path. This code is executed for every request to the router
router.use(function (req, res, next) {
console.log('Time:', Date.now())
next()
})
// a middleware sub-stack shows request info for any type of HTTP request to the /user/:id path
router.use('/user/:id', function (req, res, next) {
console.log('Request URL:', req.originalUrl)
next()
}, function (req, res, next) {
console.log('Request Type:', req.method)
next()
})
In your case you may add some permission validation before request. Usually it's an API key, but it can be anything, secret word in header, secret parameter, everything.
Here is the example for your case.
function isPermitted(req, res, next) {
var permitted = false;
// Your validation here, is your user permitted with this access or not.
if (permitted) {
next();
} else {
res.send('Sorry, you are not belong here.');
}
}
/* GET home page. */
router.get('/', isPermitted, function(req, res, next) {
//console.log("pending data");
res.locals.connection.query('SELECT id,name,email,username,address,phone,status FROM user', function (error, results, fields) {
if (error) throw error;
res.send(JSON.stringify(results));
});
});
Use POST instead of GET as method for request.

Express app - Change base url

I'm building a Q&A app following this tutorial and everything goes well, but I need to change the chance to change the base root where the app is being served via config files.
Now the app is served in localhost:8080 and I need to be served over localhost:8080/qae (for example).
I think the answer is near this piece of code:
// Setup server
var app = express();
var server = http.createServer(app);
var socketio = require('socket.io')(server, {
serveClient: config.env !== 'production',
path: '/socket.io-client'
});
require('./config/socketio')(socketio);
require('./config/express')(app);
require('./routes')(app);
// Start server
function startServer() {
app.angularFullstack = server.listen(config.port, config.ip, function() {
console.log('Express server listening on %d, in %s mode '+config.ip, config.port, app.get('env'));
});
}
setImmediate(startServer);
(from /server/app.js)
But I can't figure it. Is it possible doing this in a simple way?
////////EDIT////////
I tried all the proposed solutions, but I'm doing something wrong and got errors. This is my routes.js in case it helps:
/**
* Main application routes
*/
'use strict';
import errors from './components/errors';
import path from 'path';
export default function(app) {
// Insert routes below
app.use('/api/cpd', require('./api/cpd'));
app.use('/api/categories', require('./api/category'));
app.use('/api/terms', require('./api/term'));
app.use('/api/qae', require('./api/qae'));
app.use('/api/stats', require('./api/stat'));
app.use('/api/tags', require('./api/tag'));
app.use('/api/questions', require('./api/question'));
app.use('/api/things', require('./api/thing'));
app.use('/api/users', require('./api/user'));
app.use('/auth', require('./auth'));
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
// All undefined asset or api routes should return a 404
app.route('/:url(api|auth|components|app|bower_components|assets)/*')
.get(errors[404]);
// All other routes should redirect to the index.html
app.route('/*')
.get((req, res) => {
res.sendFile(path.resolve(app.get('appPath') + '/index.html'));
});
}
You can do the following:
var app = express();
var routes = require('./routes/index');
app.set('base', '/qae');
then you need to add route
app.use('/qae', routes);
Hope this helps :)
You should change your rooting to this:
app.use('/qae',require('./routes'))
and in routes/index.js you can have all declarations of your routes.
In routes.js
export default function(app) {
// Insert routes below
app.use('/qae', require('./api'));
app.use('/auth', require('./auth'));
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
// All undefined asset or api routes should return a 404
app.route('/:url(api|auth|components|app|bower_components|assets)/*')
.get(errors[404]);
// All other routes should redirect to the index.html
app.route('/*')
.get((req, res) => {
res.sendFile(path.resolve(app.get('appPath') + '/index.html'));
});
}
create file index.js in api
const express = require('express')
const router = express.Router()
router.use('/api/cpd', require('./cpd'));
router.use('/api/categories', require('./category'));
router.use('/api/terms', require('./term'));
router.use('/api/qae', require('./qae'));
router.use('/api/stats', require('./stat'));
router.use('/api/tags', require('./tag'));
router.use('/api/questions', require('./question'));
router.use('/api/things', require('./thing'));
router.use('/api/users', require('./user'));
module.exports = router
That way all your api routes will look like /qae/api/*. If you need auth also after this prefix you need to do it same way.
Best solution is to have i app.use('/',...) including routers from subfolders.
If your ./routes module returned a router instead of taking an app object, then you could do this to make it available in / route:
app.use(require('./routes'));
or this to use /qae prefix:
app.use('/qae', require('./routes'));
but since you pass the app object to the function exported by ./routes then it is the ./routes module that actually registers the routes and since you didn't include its code it's hard to give you a specific example. I can only say that you will need to change the routes definitions in ./routes for a different prefix, and you'd need to return a router instead of taking app argument for the above examples to work.
Tthen you ./routes would have to look like this:
let express = require('express');
let router = express.Router();
router.get('/xxx', (req, res) => {
// ...
});
router.get('/yyy', (req, res) => {
// ...
});
module.exports = router;
and only then you'll be able to use:
app.use('/qae', require('./routes'));
in the main code.
Folder Structure
bin/
www
server/
routes/
index.js
book.js
views/
index.ejs
app.js
router.js
error.js
public/
package.json
app.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
require('./router')(app);
require('./errors')(app);
module.exports = app;
route.js
var index = require('./routes/index');
var books = require('./routes/books');
var base = '/api';
module.exports = function (app) {
app.use(base+'/', index);
app.use(base+'/books', books);
};
error.js
module.exports = function (app) {
app.use(function (req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function (err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
app.use(function (err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
};
index.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
module.exports = router;

express - getting path of parrent router?

Lets say I want to have 2 different instances in "subfolders" in the url. In app js I have it defined like this:
var routes = require('./routes/index');
app.use('/myapp1', routes);
app.use('/myapp2', routes);
The inner routing would be the same.
But still in the router I want to "get" the path defined in the app.use - eg.: myapp1, myapp2
How do I get this in the router?
From routes/index.js:
router.use(/\/.*/, function (req, res, next) {
// want to see "myapp1/myapp2" without the *sub* path defined in this particular router eg.: /products /user etc.
next();
});
You might want to use the req.baseUrl property.
Example:
routes.get('/1', function(req, res) {
res.send([
req.baseUrl,
req.path,
req.baseUrl + req.path,
].join('\n'));
});
app.use('/api', routes);
Making an HTTP request to /api/1 would print:
/api
/1
/api/1
var express = require('express');
var app = express();
var router = express.Router();
app.use(function(req, res, next) {
req.appInstance = (req.url.indexOf('/app2/') == 0) ? 2 : 1;
next();
});
app.get('/', function(req, res, next) {
res.redirect('/app1/user');
});
router.get('/user', function(req, res, next) {
res.send(req.url +' on app' + req.appInstance);
});
app.use('/app1', router);
app.use('/app2', router);
app.listen(3000, function () {
console.log('Example app listening on port 3000!');
});

Order of router precedence in express.js

I would like to understand the order precedence in express.js. For example, as bellow code
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/api', api);
app.use('/users', users);
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});
If a request come from client localhost:3000/api/abc and localhost:3000/user/abc, the response from api and user module. But if I make a request like localhost:3000/myName/xyz, the app module return a response. This behavior let me concern about what is precedence of expressjs and what is correct order for router modules. Why routers do not confuse between actions "api", "users" and parameter ":name". Please let me understand clearly how express does and what is precedence.
The order is first come first serve.
In your case, if user hits /api, he will get response from api, but if you write /:name route before /api, /:name will serve for /api requests also.
Case1: /api will serve requests for /api.
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/api', api);
app.use('/users', users);
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});
Case2: /:name serves requests for /api and /users
var routes = require('./routes/index');
var users = require('./routes/users');
var api = require('./routes/api');
app.use('/:name', function(req, res, next) {
console.log('from app.js name:', req.params.name);
res.render('index', {
title: req.params.name
});
}, routes);
app.use('/api', api);
app.use('/users', users);
app.use('/', function(req, res, next) {
res.render('index', {
title: 'MainPage'
});
});
The example given in the ExpressJS documentation is pretty simple and was unfortunately difficult to find. I only found it through another SO question.
Middleware functions are executed sequentially, therefore the order of middleware inclusion is important
app.use(function(req, res, next) {
res.send('This is the only thing that ever happens')
}
app.use(...) // never used
app.get(...) // never used
app.put(...) // never used
app.post(...) // never used

Callback routes with expressjs

Please, i need to figure out why the external callback(defined in a diff file) assigned to a route like
app.get('/list', routes.list);
it's working and if I define
var router = express.Router();
router.get('/list', routes.list);
the callback stops to work.
Thanks.
You should apply routes for your application, for example
var routes = {
list: function (req, res, next) {
res.sendFile(path.join(__dirname, './public', 'index.html'));
}
};
// app.get('/list', routes.list);
router.get('/list', routes.list);
// apply the routes to our application
app.use('/', router);
app.listen(3000);

Resources