I'm trying to render an index.html but I get the error enoent, even with the right path.
//folders tree
test/server.js
test/app/routes.js
test/public/views/index.html
//routes.js
app.get('*', function(req, res) {
res.sendFile('views/index.html');
});
//server.js
app.use(express.static(__dirname + '/public'));
require('./app/routes')(app);
I also tried
res.sendFile(__dirname + '/public/views/index.html');
If I use
res.sendfile('./public/views/index.html');
then it works, but I see a warning that says sendfile is deprecated and I have to use sendFile.
Try adding :
var path = require('path');
var filePath = "./public/views/index.html"
var resolvedPath = path.resolve(filePath);
console.log(resolvedPath);
return res.sendFile(resolvedPath);
This should clear up whether the file path is what you expect it to be
Try using the root option, that did it for me :
var options = {
root: __dirname + '/public/views/',
};
res.sendFile('index.html', options, function (err) {
if (err) {
console.log(err);
res.status(err.status).end();
}
else {
console.log('Sent:', fileName);
}
});
you can try below code
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
app.use(express.static(path.join(__dirname, 'public/views')));
Handle api call
app.use('/', function(req, res, next) {
console.log('req is -> %s', req.url);
if (req.url == '/dashboard') {
console.log('redirecting to -> %s', req.url);
res.render('dashboard');
} else {
res.render('index');
}
});
The problem is that you've defined static file middleware, but then you define a route in front of that that tries to handle serving the static files (so the static file middleware actually does nothing here). So if you want to res.sendFile something from a route you would need to give either an absolute path to it. Or, you could just remove the app.get('*', ...) route and let the express middleware do its job.
I am working through setting up a http server using node.js and engine. However, I keep running into issues that I have little information on how to resolve I would appreciate some help solving this please.
Error: No default engine was specified and no extension was provided.
at new View (...\node_modules\express\lib\view.js:41:42)
at Function.app.render (...\node_modules\express\lib\application.js:484:12)
at ServerResponse.res.render (...\node_modules\express\lib\response.js:783:7)
at Layer.handle (...\app.js:123:7)
at trim_prefix (...\node_modules\express\lib\router\index.js:225:17)
at c (...\node_modules\express\lib\router\index.js:198:9)
at Function.proto.process_params (...\node_modules\express\lib\router\index.js:253:12)
at next (...\node_modules\express\lib\router\index.js:189:19)
at next (...\node_modules\express\lib\router\index.js:202:7)
at next (...\node_modules\express\lib\router\index.js:166:38)
Below is what I have set up to start up this engine.
var http = require('http');
var module = require("module")
var logger = require('morgan');
var express = require('express');
var app = module.exports = express();
var silent = 'test' == process.env.NODE_ENV;
var httpServer = http.createServer(app); // app middleware
app.enable('strict routing');
// app.all('*', function(req, res, next)/*** CORS support.*/
// {
// if (!req.get('Origin')) return next();// use "*" here to accept any origin
// res.set('Access-Control-Allow-Origin', 'http://localhost:3000');
// res.set('Access-Control-Allow-Methods', 'GET, POST');
// res.set('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
// res.set('Access-Control-Allow-Max-Age', 3600);
// if ('OPTIONS' == req.method) return res.send(200);
// next();
// });
app.set('views', __dirname + '/views'); // general config
app.set('view engine', 'html');
app.get('/404', function(req, res, next){
next();// trigger a 404 since no other middleware will match /404 after this one, and we're not responding here
});
app.get('/403', function(req, res, next){// trigger a 403 error
var err = new Error('not allowed!');
err.status = 403;
next(err);
});
app.get('/500', function(req, res, next){// trigger a generic (500) error
next(new Error('keyboard cat!'));
});
app.use(express.static(__dirname + '/public'));
//error handlers
app.use(logErrors);
app.use(clientErrorHandler);
app.use(errorHandler);
// middleware with an arity of 4 are considered error handling middleware. When you next(err)
// it will be passed through the defined middleware in order, but ONLY those with an arity of 4, ignoring regular middleware.
function clientErrorHandler(err, req, res, next) {
if (req.xhr) {// whatever you want here, feel free to populate properties on `err` to treat it differently in here.
res.send(err.status || 500, { error: err.message });
}
else
{ next(err);}
};
// create an error with .status. we can then use the property in our custom error handler (Connect repects this prop as well)
function error (status, msg) {
var err = new Error(msg);
err.status = status;
return err;
};
function logErrors (err, req, res, next) {
console.error(err.stack);
next(err);
};
function errorHandler (err, req, res, next) {
res.status(500);
res.render('error', { error: err });
};
// Error handlers
// Since this is the last non-error-handling middleware use()d, we assume 404, as nothing else responded.
// $ curl http://localhost:3000/notfound
// $ curl http://localhost:3000/notfound -H "Accept: application/json"
// $ curl http://localhost:3000/notfound -H "Accept: text/plain"
app.use(function(req, res, next){
res.status(404);
if (req.accepts('html')) {// respond with html page
res.render('404', { url: req.url });
return;
}
if (req.accepts('json')) {// respond with json
res.send({ error: 'Not found' });
return;
}
res.type('txt').send('Not found');// default to plain-text. send()
});
// error-handling middleware, take the same form as regular middleware, however they require an
// arity of 4, aka the signature (err, req, res, next).when connect has an error, it will invoke ONLY error-handling middleware.
// If we were to next() here any remaining non-error-handling middleware would then be executed, or if we next(err) to
// continue passing the error, only error-handling middleware would remain being executed, however here
// we simply respond with an error page.
app.use(function(err, req, res, next){
// we may use properties of the error object here and next(err) appropriately, or if we possibly recovered from the error, simply next().
res.status(err.status || 500);
res.render('500', { error: err });
});
if (!module.parent) {// assigning to exports will not modify module, must use module.exports
app.listen(3000);
silent || console.log('Express started on port 3000');
};
The res.render stuff will throw an error if you're not using a view engine.
If you just want to serve json replace the res.render('error', { error: err }); lines in your code with:
res.json({ error: err })
PS: People usually also have message in the returned object:
res.status(err.status || 500);
res.json({
message: err.message,
error: err
});
You are missing the view engine, for example use jade:
change your
app.set('view engine', 'html');
with
app.set('view engine', 'jade');
If you want use a html friendly syntax use instead ejs
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
EDIT
As you can read from view.js Express View Module
module.exports = View;
/**
* Initialize a new `View` with the given `name`.
*
* Options:
*
* - `defaultEngine` the default template engine name
* - `engines` template engine require() cache
* - `root` root path for view lookup
*
* #param {String} name
* #param {Object} options
* #api private
*/
function View(name, options) {
options = options || {};
this.name = name;
this.root = options.root;
var engines = options.engines;
this.defaultEngine = options.defaultEngine;
var ext = this.ext = extname(name);
if (!ext && !this.defaultEngine) throw new Error('No default engine was specified and no extension was provided.');
if (!ext) name += (ext = this.ext = ('.' != this.defaultEngine[0] ? '.' : '') + this.defaultEngine);
this.engine = engines[ext] || (engines[ext] = require(ext.slice(1)).__express);
this.path = this.lookup(name);
}
You must have installed a default engine
Express search default layout view by program.template as you can read below:
mkdir(path + '/views', function(){
switch (program.template) {
case 'ejs':
write(path + '/views/index.ejs', ejsIndex);
break;
case 'jade':
write(path + '/views/layout.jade', jadeLayout);
write(path + '/views/index.jade', jadeIndex);
break;
case 'jshtml':
write(path + '/views/layout.jshtml', jshtmlLayout);
write(path + '/views/index.jshtml', jshtmlIndex);
break;
case 'hjs':
write(path + '/views/index.hjs', hoganIndex);
break;
}
});
and as you can read below:
program.template = 'jade';
if (program.ejs) program.template = 'ejs';
if (program.jshtml) program.template = 'jshtml';
if (program.hogan) program.template = 'hjs';
the default view engine is jade
Comment out the res.render lines in your code and add in next(err); instead. If you're not using a view engine, the res.render stuff will throw an error.
Sorry, you'll have to comment out this line as well:
app.set('view engine', 'html');
My solution would result in not using a view engine though. You don't need a view engine, but if that's the goal, try this:
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
//swap jade for ejs etc
You'll need the res.render lines when using a view engine as well. Something like this:
// error handlers
// 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
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
next(err);
res.render('error', {
message: err.message,
error: {}
});
});
If you wish to render a html file, use:
response.sendfile('index.html');
Then you remove:
app.set('view engine', 'html');
Put your *.html in the views directory, or serve a public directory as static dir and put the index.html in the public dir.
instead of
app.get('/', (req, res) => res.render('Hellooooo'))
use
app.get('/', (req, res) => res.send('Hellooooo'))
Please replace
app.set('view engine', 'html');
with
app.set('view engine', 'ejs');
set view engine following way
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
If all that's needed is to send html code inline in the code, we can use below
var app = express();
app.get('/test.html', function (req, res) {
res.header('Content-Type', 'text/html').send("<html>my html code</html>");
});
The above answers are correct, but I found that a simple typo can also generate this error. For example, I had var router = express() instead of var router = express.Router() and got this error. So it should be the following:
// App.js
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended:false}));
// assuming you put views folder in the same directory as app.js
app.set('views', __dirname + '/views')
app.engine('ejs', ejs.renderFile);
app.set('view engine', 'ejs');
// router - wherever you put it, could be in app.js
var router = express.Router();
router.get('/', function (req,res) {
res.render('/index.ejs');
})
Just set view engine in your code.
var app = express();
app.set('view engine', 'ejs');
if you've got this error by using the express generator, I've solved it by using
express --view=ejs myapp
instead of
express --view=pug myapp
I just got this error message, and the problem was that I was not setting up my middleware properly.
I am building a blog in the MEAN stack and needed body parsing for the .jade files that I was using on the front end side. Here is the snippet of code from my "/middleware/index.js" file, from my project.
var express = require('express');
var morgan = require('morgan');
var session = require('express-session');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
module.exports = function (app) {
app.use(morgan('dev'));
// Good for now
// In the future, use connect-mongo or similar
// for persistant sessions
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(cookieParser());
app.use(session({secret: 'building a blog', saveUninitialized: true, resave: true}));
Also, here is my "package.json" file, you may be using different versions of technologies.
Note: because I am not sure of the dependencies between them, I am including the whole file here:
"dependencies": {
"body-parser": "1.12.3",
"consolidate": "0.12.1",
"cookie-parser": "1.3.4",
"crypto": "0.0.3",
"debug": "2.1.1",
"express": "4.12.2",
"express-mongoose": "0.1.0",
"express-session": "1.11.1",
"jade": "1.9.2",
"method-override": "2.3.2",
"mongodb": "2.0.28",
"mongoose": "4.0.2",
"morgan": "1.5.1",
"request": "2.55.0",
"serve-favicon": "2.2.0",
"swig": "1.4.2"
}
Hope this helps someone! All the best!
You can use express-error-handler to use static html pages for error handling and to avoid defining a view handler.
The error was probably caused by a 404, maybe a missing favicon (apparent if you had included the previous console message). The 'view handler' of 'html' doesn't seem to be valid in 4.x express.
Regardless of the cause, you can avoid defining a (valid) view handler as long as you modify additional elements of your configuration.
Your options are to fix this problem are:
Define a valid view handler as in other answers
Use send() instead of render to return the content directly
http://expressjs.com/en/api.html#res.render
Using render without a filepath automatically invokes a view handler as with the following two lines from your configuration:
res.render('404', { url: req.url });
and:
res.render('500);
Make sure you install express-error-handler with:
npm install --save express-error-handler
Then import it in your app.js
var ErrorHandler = require('express-error-handler');
Then change your error handling to use:
// define below all other routes
var errorHandler = ErrorHandler({
static: {
'404': 'error.html' // put this file in your Public folder
'500': 'error.html' // ditto
});
// any unresolved requests will 404
app.use(function(req,res,next) {
var err = new Error('Not Found');
err.status(404);
next(err);
}
app.use(errorHandler);
Error: No default engine was specified and no extension was provided
I got the same problem(for doing a mean stack project)..the problem is i didn't mentioned the formate to install npm i.e; pug or jade,ejs etc. so to solve this goto npm and enter express --view=pug foldername. This will load necessary pug files(index.pug,layout.pug etc..) in ur given folder .
If you are using NestJS, to solve this issue you have to change your main.ts file.
Please consider using this example bellow:
Like this demo in NestJS - MVC
import { NestFactory } from '#nestjs/core';
import { NestFastifyApplication, FastifyAdapter } from '#nestjs/platform-fastify';
import { AppModule } from './app.module';
import { join } from 'path';
async function bootstrap() {
const app = await NestFactory.create<NestFastifyApplication>(
AppModule,
new FastifyAdapter(),
);
app.useStaticAssets({
root: join(__dirname, '..', 'public'),
prefix: '/public/',
});
app.setViewEngine({
engine: {
handlebars: require('handlebars'),
},
templates: join(__dirname, '..', 'views'),
});
await app.listen(3000);
}
bootstrap();
Is it possible to build a code like this in node.js?
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond% {REQUEST_URI}! / (View) / [NC]
RewriteCond% {REQUEST_FILENAME}!-F
RewriteRule ^ (. *) $ Index.html [L, QSA]
</IfModule>
url display a route is not "view" and also the file does not exist then write index.html.
using something like express or connect
UPDATE: I need a regular expression for !/(view)/ in route for express in node.js.
Have you tried:
Serve statics
Catch /view URL
Catch everything else
app.configure(function(){
app.use(express.static(__dirname+'/public')); // Catch static files
app.use(app.routes);
});
// Catch /view and do whatever you like
app.all('/view', function(req, res) {
});
// Catch everything else and redirect to /index.html
// Of course you could send the file's content with fs.readFile to avoid
// using redirects
app.all('*', function(req, res) {
res.redirect('/index.html');
});
OR
Serve statics
Check if URL is /view
app.configure(function(){
app.use(express.static(__dirname+'/public')); // Catch static files
app.use(function(req, res, next) {
if (req.url == '/view') {
next();
} else {
res.redirect('/index.html');
}
});
});
OR
Catch statics as usual
Catch NOT /view
app.configure(function(){
app.use(express.static(__dirname+'/public')); // Catch static files
app.use(app.routes);
});
app.get(/^(?!\/view$).*$/, function(req, res) {
res.redirect('/index.html');
});
The final structure is:
var express = require('express'), url = require('url');
var app = express();
app.use(function(req, res, next) {
console.log('%s %s', req.method, req.url);
next();
});
app.configure(function() {
var pub_dir = __dirname + '/public';
app.set('port', process.env.PORT || 8080);
app.engine('.html', require('ejs').__express);
app.set('views', __dirname + '/views');
app.set('view engine', 'html');
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser());
app.use(express.static(pub_dir));
app.use(app.router);
});
app.get('/*', function(req, res) {
if (req.xhr) {
var pathname = url.parse(req.url).pathname;
res.sendfile('index.html', {root: __dirname + '/public' + pathname});
} else {
res.render('index');
}
});
app.listen(app.get('port'));
Thanks everyone.
PD: Render html with module ejs
I would recommend using the express Middleware urlrewrite.
If you don't handle rewrites on a reverse proxy for example and if using express and want regex support for flexibility use: https://www.npmjs.com/package/express-urlrewrite
I have the root route and it works fine. I also have a another route 127.0.0.1:3000/dashboard if I just type that url into the address bar I get this error:
Cannot GET /dashboard
If I create a link to the same url it works fine.
If I then refresh that page I get the same error again.
Below is my node.js route
app.js
/**
* Module dependencies.
*/
var express = require('express')
, routes = require('./routes')
, stats = require('./routes/stats')
, tests = require('./routes/test')
, http = require('http')
, util = require('util')
, path = require('path');
var app = module.exports = express();
app.configure(function(){
/*
* Configuration
*
*/
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
/*
* Middleware definitions
*
*/
app.use(express.favicon());
app.use(express.logger('dev'));
/*
* Error handling middleware
*/
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser('shhhhhhhh, super secret'));
app.use(app.router);
// serves up dynamic css files
app.use(require('stylus').middleware(__dirname + '/public'));
app.use(require('less-middleware')({ src: __dirname + '/public' }));
// serves a static path
app.use(express.static(path.join(__dirname, 'public')));
});
app.configure('development', function(){
app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function(){
app.use(express.errorHandler());
});
/*
* Endpoints
*/
app.get('/', routes.index);
app.get('/test', tests.get);
app.post('/test', tests.post);
app.options('/test', tests.options);
app.get('/stats/sends', stats.sends.get);
app.get('/stats/events', stats.events.get);
app.get('/stats/attempts', stats.attempts.get);
app.get('/stats/errors', stats.errors.get);
app.get('/stats/mquad', stats.mquad.get);
app.get('/partials/:name', routes.partials);
app.get('/index/landing', routes.landing);
app.get('/index/dashboard', routes.dashboard);
console.log('Env: ' + app.settings.env);
http.createServer(app).listen(app.get('port'), function(){
console.log("Express server listening on port " + app.get('port'));
});
routes/index.js
exports.dashboard = function(req, res){
res.render('dashboard');
};
Angular route
'use strict';
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']).
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
templateUrl: 'partials/landing',
controller: LandingCtrl
}).
when('/dashboard', {
templateUrl: 'partials/dashboard',
controller: DashboardCtrl
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
}]);
The reason this does not work is that your server is not catching all other routes and routing them to your single page app which is served by routes.index.
In order to catch all other routes and route them to the index page so that your angular app can see if it matches the supplied url all you need to do is add the following line after your last route is declared:
app.get('*', routes.index);
Now you should be able to:
navigate directly to a url served by your Angular.js app
refresh any page without error
This article might help:
http://jjt.io/2013/11/16/angular-html5mode-using-yeoman-generator-angular/
In a nutshell:
npm install --save-dev connect-modrewrite
Gruntfile:
connect: {
options: {
// ...
// Modrewrite rule, connect.static(path) for each path in target's base
middleware: function (connect, options) {
var optBase = (typeof options.base === 'string') ? [options.base] : options.base;
return [require('connect-modrewrite')(['!(\\..+)$ / [L]'])].concat(
optBase.map(function(path){ return connect.static(path); }));
}
}
}
Route app.get('/index/dashboard', routes.dashboard); refers to http://hostname/index/dashboard whereas when('/dashboard', { ... }) refers to http://hostname/dashboard.
You should correct the route: app.get('/dashboard', routes.dashboard);
I'd suggest a pretty fast javascript solution in front and back end.
NodeJs
// set up our one route to the index.html file
app.get('*', function (req, res){
res.sendFile(path.join(__dirname+'/public/index.html'));
});
This code tells to de local/remote server where is the main html, so it could find the rest of templates.
AngularJs
// If 404 Redirect to home
$routeProvider.otherwise( { redirectTo: '/'} );
This is also really helpful, so never goes to a missing page.
I have some code that looks like the following:
app.configure(function() {
app.set("views", __dirname + "/views");
app.set("view engine", "ejs");
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.logger());
app.use(app.router);
app.use(express.static(__dirname + "/public"));
});
//Routes
app.get("/", function(req, res) {
res.render("index.ejs", {locals: {
title: "Welcome"
}});
});
//Handle 404
app.get("/*", function(req, res, next) {
next("Could not find page");
});
The problem I have is that I can't access anything in the /public static directory: everything gets caught by the 404 route. Am I missing something about how this is supposed to work?
You're doing
app.use(app.router);
app.use(express.static(__dirname + "/public"));
What you want to do is
app.use(express.static(__dirname + "/public"));
app.use(app.router);
Since you have a catch all route in app.router it must be lower then anything else. otherwise the catch all route will indeed catch everything and the rest of the middleware is ignored.
As an aside catch all routes like that are bad.
A better solution would be to place the following code after all calls to app.use:
app.use(function(req, res) {
res.send(404, 'Page not found');
});
Or a similar function.
Do this instead of using app.get("/*", ...
I'm doing it a slightly different way. If you look at the middleware code for the static file server it allows for a callback function that gets called with errors. Only catch is you need the response object to send something useful back to the server. So I do the following:
var errMsgs = { "404": "Dang that file is missing" };
app.use(function(req, res, next){
express.static.send(req, res, next, {
root: __dirname + "/public",
path: req.url,
getOnly: true,
callback: function(err) {
console.log(err);
var code = err.status || 404,
msg = errMsgs["" + code] || "All is not right in the world";
res.render("error", { code: code, msg: msg, layout: false});
}
});
});
Basically what happens is if there is an error it renders my pretty error page and logs something so that I can debug somewhere.