I have an app.js file like so:
...
var socket = require('./app/sockets')(io)
var routes = require('./app/routes')(server, socket)
...
The sockets.js looks like so:
exports = module.exports = function(io) {
return {
emit: function() {
io.emit('hi', "Some stuff")
}
}
}
The routes.j file looks like so:
exports = module.exports = function(app, io) {
...
var user = require('./controllers/user')(io)
app.get({ path: '/users/:id', version: '1.0' }, user.getUserById);
...
}
Finally, my user.js file looks like so:
exports = module.exports = function(io) {
return {
...
getPersonById: function(req, res, next) {
....
io.emit("Hello")
...
},
....
}
}
Is there a better way to organize this? I feel like I am threading my io instance through 4 different files. I just want a singleton instance I can emit events on, from within my controller.
I,m using something like this, in express.io :
app.js
var router = require('./routes/router'),
express = require('express.io'),
app = new express();
app.http().io();
app.use(app.router);
app = router.index(app);
app.listen(3000);
./routes/router.js
exports.index = function(app){
var IndexIo = require(__maindir + '/routes/io/IndexIo');
app.io.route('page/action', IndexIo.action);
app.io.route('page/action2', IndexIo.action2);
return app;
};
/routes/io/IndexIo.js
exports.action = function(req){
doSomething();
req.io.emit('doSomething', {});
}
exports.action2 = function(req){
doSomething();
req.io.emit('doSomething', {});
}
Related
I have been closely trying to follow this Vue SSR guide and in that example the author has placed his Express routes within a file called server.js. Simply for organisation purposes, I wish to keep my Express routes in a router.express.js file within my src/router folder instead of in the root file of server.js.
So this is a cutdown version of my router.express.js file:
const vueServerRenderer = require('vue-server-renderer');
const setupDevServer = require('../../build/setup-dev-server'); //webpack dev config
const express = require('express');
const app = express();
const router = express.Router();
const createRenderer = (serverBundle) =>
vueServerRenderer.createBundleRenderer(serverBundle, {
runInNewContext: false,
template: fs.readFileSync(path.resolve(__dirname, '../index.html'), 'utf-8')
});
let renderer;
if (process.env.NODE_ENV === 'development') {
setupDevServer(app, (serverBundle) => {
renderer = createRenderer(serverBundle);
});
} else {
renderer = createRenderer(require('../../dist/vue-ssr-server-bundle.json'));
}
router.get('/', async function (req, res) {
const context = {
url: req.params['0'] || '/'
};
let html;
try {
html = await renderer.renderToString(context);
} catch (error) {
if (error.code === 404) {
return res.status(404).send('404 | Page Not Found');
}
return res.status(500).send('500 | Internal Server Error');
}
res.end(html);
});
module.exports = router;
The problem is that I also need the vue-server-renderer code to be in the server.js file. I would then make the app require the router.express.js file so the Express routes work like this:
const vueServerRenderer = require('vue-server-renderer');
const setupDevServer = require('../../build/setup-dev-server'); //webpack dev config
const app = express();
const createRenderer = (serverBundle) =>
vueServerRenderer.createBundleRenderer(serverBundle, {
runInNewContext: false,
template: fs.readFileSync(path.resolve(__dirname, '../index.html'), 'utf-8')
});
let renderer;
if (process.env.NODE_ENV === 'development') {
setupDevServer(app, (serverBundle) => {
renderer = createRenderer(serverBundle);
});
} else {
renderer = createRenderer(require('../../dist/vue-ssr-server-bundle.json'));
}
app.use(require('./router/express.router.js'));
Whenever I do this, I get a Webpack error stating that
WebpackOptionsValidationError: Invalid configuration object. Webpack
has been initialised using a configuration object that does not match
the API schema.
- configuration.entry'app' should be a string.
If I remove the vue-server-renderer code from server.js then it runs fine. But the reason for having that code within server.js is so that the development environment works properly. Basically if the code is not in server.js then I cannot use hot-reloading or anything.
If I get rid of router.express.js and put all that code in server.js including the routes, then it all works perfectly including my development environment.
Why can I not (or rather how can I) keep my Express routes in a separate file and still have the vue-server-renderer stuff work?
Update: setup-dev-server.js file:
const setupDevServer = (app, onServerBundleReady) => {
const webpack = require('webpack');
const MFS = require('memory-fs');
const path = require('path');
const clientConfig = require('./webpack.client.config');
const serverConfig = require('./webpack.ssr.config');
// additional client entry for hot reload
clientConfig.entry.app = ['webpack-hot-middleware/client', clientConfig.entry.app];
const clientCompiler = webpack(clientConfig);
// setup dev middleware
app.use(require('webpack-dev-middleware')(clientCompiler, {
publicPath: clientConfig.output.publicPath,
serverSideRender: true,
logLevel: 'silent',
}));
// setup hot middleware
app.use(require('webpack-hot-middleware')(clientCompiler));
// watch src files and rebuild SSR bundle
global.console.log('Building SSR bundle...');
const serverCompiler = webpack(serverConfig);
const mfs = new MFS();
serverCompiler.outputFileSystem = mfs;
serverCompiler.watch({}, (error, stats) => {
if (error) throw error;
global.console.log(
`${stats.toString({
colors: true,
modules: false,
children: false,
chunks: false,
chunkModules: false,
})}\n\n`
);
if (stats.hasErrors()) {
console.error(stats.compilation.errors);
throw new Error(stats.compilation.errors);
}
// read bundle generated by vue-ssr-webpack-plugin
const bundle = JSON.parse(
mfs.readFileSync(path.join(clientConfig.output.path, 'vue-ssr-server-bundle.json'), 'utf-8')
);
onServerBundleReady(bundle);
});
};
module.exports = setupDevServer;
1) Inside of your 'router.express.js' file write: module.exports = router; at the bottom of the file.
2) Inside of your 'server.js' file write: const router = require('./router/express.router.js');
at the top of the file.
3) And now where you used to have app.use(require('./router/express.router.js'));
replace that with app.use(router);
4) At the top of 'server.js' write const vueSsrBundle = require('../../dist/vue-ssr-server-bundle.json')
5) Lastly replace renderer = createRenderer(require('../../dist/vue-ssr-server-bundle.json')
With renderer = createRenderer(vueSsrBundle)
EDIT the issue you are facing is on this line And probably related to the file 'app.js' or 'client-entry-js'
I have the following node / express code;
// Requires
var app = require("express")();
var handler = require("./routes/session");
// Routes
app.post("/session", handler.sessionGetNew);
app.get("/session", handler.sessionGetAll);
app.get("/session/:sessionid", handler.sessionGetOne);
app.put("/session/:sessionid", handler.sessionUpdate);
app.delete("/session/:sessionid", handler.sessionDelete);
// Listener
app.listen(9000);
console.log("Listening.....");
Is there any way to refactor the routes to something like this pseudcode?
app.route("/session"),
.post(handler.session....)
.get(handler.session.....)
app.route("/session/:sessionid"),
.post(handler.session....)
.get(handler.session....)
.put(handler.session....)
You can use Router Middleware
app.js
var app = require('express')();
var session = require('./routes/session');
app.use('/session', session);
app.listen(9000, function() {
console.log('listening');
});
routes/session.js
var router = require('express').Router();
var handler = require('./lib/sessionHandler'); // this was 'handler' in app.js
router.post('/', handler.sessionGetNew);
router.get('/', handler.sessionGetAll);
router.get('/:sessionid', handler.sessionGetOne);
router.put('/:sessionid', handler.sessionUpdate);
router.delete('/:sessionid', handler.sessionDelete);
module.exports = router;
This gives you approximately what you want
function routReductor(route, methods) {
var goodMethods = ['get', 'post', 'put', 'delete'];
for (var key in methods) {
if (goodMethods.indexOf(key) == -1) continue;
app[key](route, methods[key])
}
}
routReductor('/:sessionid', {
get: handler.sessionGetOne,
put: handler.sessionUpdate,
delete: handler.sessionDelete
});
I'm using shrinkroute https://npmjs.org/package/shrinkroute to make links in nodejs. I get error 500 ReferenceError: shrinkr is not defined
How to pass shrinkroute to routes/index.js? Is there a better way to create url by passing query string args?
//app.js
var app = express();
var shrinkr = shrinkroute( app, {
"user": {
path: "/user/:id?",
get: routes.showOrListUsers
}
});
//url method works in app.js
var url = shrinkr.url( "user", { id: 5, page:40, type:'a' } );
console.log(url);
app.use( shrinkr.middleware );
//routes/index.js
exports.showOrListUsers = function(req, res, next) {
console.log(req.params);
//shrinkr errors out in index.js
var url2 = shrinkr.url( "users", {name: "foo"});
console.log(url2);
}
One solution would be to store shrinkr in your app object using app.set:
// app.js
...
app.set('shrinkr', shrinkr);
...
In routes/index.js, you can access it through the req.app or res.app objects:
exports.showOrListUsers = function(req, res, next) {
var shrinkr = req.app.get('shrinkr');
...
};
A bit late to the party, but the following works as well:
app.js
var my_var = 'your variable';
var route = require('./routes/index')(my_var);
app.get('/', route);
and meanwhile in route.js
var express = require('express')
, router = express.Router()
// Router functions here, as normal; each of these
// run only on requests to the server
router.get('/', function (req, res, next) {
res.status(200).end('Howdy');
});
module.exports = function(my_var){
// do as you wish
// this runs in background, not on each
// request
return router;
}
Two easy ways to achieve what you want:
1. Accessing your shrinkroute instance from within your route
Simple as that. Nothing else is required after Shrinkroute is setup.
exports.showOrListUsers = function(req, res, next) {
var shrinkr = req.app.shrinkroute;
console.log( "Route: " + req.route.name ); // ta-da, made available by Shrinkroute
// do your URL buildings
};
2. Using the middleware
If you don't want be tempted with non URL building methods of Shrinkroute, you can use the middleware, which will make available to you some helpers in your route and in your template (via locals):
// app.js
app.use( shrinkr.middleware );
// routes/index.js
exports.showOrListUsers = function(req, res, next) {
console.log( "Route: " + req.route.name ); // ta-da, made available by Shrinkroute
req.buildUrl( "users", { name: "foo" } );
// or, if you want the full url with the scheme and host...
req.buildFullUrl( "users", { name: "foo" } );
};
And maybe you want to use them in your templates as well?
// templates/index.jade
a( href=url( "users", { name: "foo" } ) ) Foo profile
a( href=fullUrl( "users", { name: "foo" } ) ) Foo profile
This method has the advantage that you don't get direct access to route setters inside a route.
Disclaimer: I'm the author of Shrinkroute.
you should import it. add following line to the very beginning of your code
var shrinkroute = require('shrinkroute');
Diving into node, I have a question on how an included script, can access the main's script methods or variables
For instance, say that I have a logger object initiated in the main script and I include another js file, which needs access to the logger. How can I do that, without injecting the logger to the included script.
//main node script
var logger = require('logger'),
app = require("./app.js")
//app.js
function something(){
//access logger here !!!!!!!
}
exports.something = something
Hope it is clear
Thanks
Try doing:
//main node script
var logger = require('logger'),
app = require("./app.js")(logger);
//app.js
var something = function (logger){
logger.log('Im here!');
}
module.exports = exports = something;
Edit:
If you want to split your main app's code into different files, on your main script file you can do something like: (This is how I'm splitting my main app.js into different sections)
// main app.js
express = require('express');
...
/* Routes ---------------------*/
require('./config/routes')(app);
/* Socket IO init -------------*/
require('./app/controllers/socket.io')(io);
/* Your other file ------------*/
require('./path/to/file')(app);
...
// config/routes.js
module.exports = function(app){
app.configure(function(){
app.get('/', ...);
...
}
}
// app/controllers/socket.io.js
module.exports = function(io){
// My custom socket IO implementation here
}
// ...etc
Edit 2:
Your function can also return a JS object, in case you want to do something on the main app.js with a custom script.
Example:
// main app.js
...
/* Some controller ---------------------*/
var myThing = require('./some/controller')(app);
myThing.myFunction2('lorem'); // will print 'lorem' on console
...
// some/controller.js
// Your function can also return a JS object, in case you want to do something on the main app.js with this require
var helperModule = require('helperModule');
module.exports = function(app){
var myFunction = function(){ console.log('lorem'); }
// An example to export a different function based on something
if (app.something == helperModule.something){
myFunction = function() { console.log('dolor'); }
}
return {
myFunction: myFunction,
myFunction2: function(something){
console.log(something);
}
}
}
You can also simply export a function or an object containing functions, without sending any parameter like this:
// main app.js
...
var myModule = require('./path/to/module');
myModule.myFunction('lorem'); // will print "lorem" in console
...
// path/to/module.js
module.exports = {
myFunction: function(message){ console.log(message); },
myFunction2: ...
}
Basically, whatever you put inside module.exports is what gets returned after the require() function.
module.exports is what is returned when you require the file. in #DavidOliveros example, that's a function that takes app or io as parameters. the function is executed right after the require takes place.
If you want to expose a method of the included script to the main, try this:
// child.js
module.exports = function(app){
var child = {};
child.crazyFunction = function(callback){
app.explode(function(){
callback();
});
};
child.otherFunction = function(){};
return child;
};
// app.js
var express = require('express');
var app = module.exports = express();
var child = require('./child.js')(app);
app.get('/', function(req, res){
child.crazyFunction(function(){
res.send(500);
});
});
I would like to pass additional data from app.js to express-resource routes and I have not figured out yet. How would you do that? Note that I'm using express-resource
// app.js
var myAddOnData = 'abc';
app.resource('users', './routes/user');
// user.js
exports.index = function (req, res) {
console.log(myAddOnData);
};
Thanks
These are the three approaches I can think of. Without the little I know about your specific problem, it sounds like middleware might be the way to do it.
With a global app variable
Create a value using app.set in app.js and then retrieve it using app.get in user.js.
Using a module
Store the information in an isolated module, then require() as needed. If this is running across multiple instances, you'd obviously want to store the values to disk as opposed to in memory.
// keystore.js
// -----------
module.exports.set = function(id, val) { /* ... */ };
module.exports.get = function(id) { /* ... */ };
// app.js
// -----------
var ks = require('./keystore');
ks.set = function("userInfo", "abc");
module.exports.get = function(id) { /* ... */ };
// user.js
// -----------
var ks = require('./keystore');
ks.get = function("userInfo", "abc");
(Maybe check out pot?)
Using Middleware
Use custom middleware to attach data to the request object which can then be accessed later in the route handlers.
//app.js
//------
var express = require('express')
, cookieSessions = require('./cookie-sessions');
var app = express();
app.use(express.cookieParser('manny is cool'));
app.use(cookieSessions('sid'));
// ...
//cookie-sessions.js
//------------------
module.exports = function(name) {
return function(req, res, next) {
req.session = req.signedCookies[name] || {};
res.on('header', function(){
res.signedCookie(name, req.session, { signed: true });
});
next();
}
}
via https://gist.github.com/visionmedia/1491756