I am currently working on an angular website running express on a nodejs server. It usually loads up perfectly when I start running it on localhost but just yesterday it suddenly started throwing this error.
GET / 500 3.467 ms - 1595
Error: Failed to lookup view "error" in views directory "C:\node\nodetest1\routes\views"
at EventEmitter.render (C:\node\nodetest1\node_modules\express\lib\application.js:579:17)
at ServerResponse.render (C:\node\nodetest1\node_modules\express\lib\response.js:960:7)
at C:\node\nodetest1\server.js:63:7
at Layer.handle_error (C:\node\nodetest1\node_modules\express\lib\router\layer.js:71:5)
at trim_prefix (C:\node\nodetest1\node_modules\express\lib\router\index.js:310:13)
at C:\node\nodetest1\node_modules\express\lib\router\index.js:280:7
at Function.process_params (C:\node\nodetest1\node_modules\express\lib\router\index.js:330:12)
at next (C:\node\nodetest1\node_modules\express\lib\router\index.js:271:10)
at Layer.handle_error (C:\node\nodetest1\node_modules\express\lib\router\layer.js:67:12)
at trim_prefix (C:\node\nodetest1\node_modules\express\lib\router\index.js:310:13)
at C:\node\nodetest1\node_modules\express\lib\router\index.js:280:7
at Function.process_params (C:\node\nodetest1\node_modules\express\lib\router\index.js:330:12)
at Immediate.next (C:\node\nodetest1\node_modules\express\lib\router\index.js:271:10)
at Immediate.<anonymous> (C:\node\nodetest1\node_modules\express\lib\router\index.js:618:15)
at runCallback (timers.js:674:20)
at tryOnImmediate (timers.js:645:5)
Here is my site directory tree:
nodetest1
bin
routes
libs
partials
views
server.js
package.json
I've been stuck on this for a day now and would really appreciate some help. Thanks!
Edit: Heres my server code below.
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 mongoose = require('mongoose');
//This connects the Mongo DB
//var mongo = require('mongodb');
//var monk = require('monk');
//var db = monk('localhost:27017/appointment');
mongoose.connect('mongodb://localhost:27017/appointment');
var app = express();
var index = require('./routes/index');
var users = require('./routes/users');
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.engine('ejs', require('ejs').renderFile);
app.set('view engine', 'ejs');
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'routes')));
//Actually uses the mongodb
//app.use(function(req,res,next){
//req.db = db;
//next();
//});
app.use('/', index);
app.use('/users', users);
app.use('/api', require('./routes/api/appointment/'));
// 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');
});
module.exports = app;
The problem:
res.render('error');
You don't have file error.ejs in views directory
In your directory structure,
views is placed inside of routes directory.
Either you have to place it outside of routes directory or
define views path like this.
app.set('views', path.join(__dirname, 'routes/views'));
Related
I have an angular application in which when I used
$locationProvider.html5Mode(true);
for removing #! , it works good. but when I refreshes the page it gives error that
Get GET /c/electronic/computer/laptop not found which is my url
This is my app.js page
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 app = express();
app.use(function(req,res,next){
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
res.setHeader('Access-Control-Allow-Credentials', true);
next();
});
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(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
app.use(function(err, req, res, next) {
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
This is my index page I putted all my functions and apis for firing queries where in models there had my mongodb's queries
var express = require('express');
var router = express.Router();
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
Category = require('./models/category');
Product = require('./models/product');
http = require('http');
mongoose.connect('mongodb://localhost/baazaronline');
var db = mongoose.connection;
router.get('/api/category', function(req, res){
Category.getCategory(function(err, category){
if(err){
throw err;
}
res.json(category);
});
});
router.get('/api/product', function(req, res){
Product.getProduct(function(err, product) {
if(err){
throw err
}
res.json(product);
})
});
router.get('/api/product/:_id', function(req, res){
Product.getProductById(req.params._id, function(err, product){
if(err){
throw err;
}
res.json(product);
});
});
Kasun, the reason that this is occurring is because you are trying to refresh the page from one of your sub routes (has nothing to do with ui-router).
Basically if you request www.yourdomain.com/ you likely have your server setup to return index.html which bootstraps your angular app. Once the app has loaded, any further url changes take html5Mode into consideration and update your page via ui-router.
When you reload your page the angular app is no longer valid as it has not loaded yet, so if you are trying to load a sub route (for example: www.yourdomain.com/someotherpage), then your server does not know how to deal with /someotherpage and likely returns 404 or some other error.
What you need to do is configure your server to return your angular app for all routes. I primarily use node/express, so I do something like:
app.get('*', function(req, res, next) {
// call all routes and return the index.html file here
}
Note: I usually use something like this as a final catch all, however I also include other routes above it for things like requesting static files, web crawlers, and any other specific routes that need to be handled.
I am a newbie when it comes to web development . I am currently working to get a real time web project up and running . I have a ms sql server 2014 working in my workplace and have installed node.js/ and used express generator to generate out an application . I have used mssql node module to connect and retrieve data from mssql server and it works.Although, Things that are confusing to me at this point:
how do i add angular 4 into the equation to help with the frontend development?i have already done npm install --save anular/cli but do not know where to start regarding creating input forms with drop downs whose values are to retrived from the DB .
my 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 index = require('./routes/index');
var users = require('./routes/users');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
// 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('/users', users);
// 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');
});
module.exports = app;
my index.js (i tried to create a connection with myssql and display a table in the index.html jade file)
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
GetData(function(recordset)
{
res.render('index', {projects: recordset })
});
});
function GetData(callback )
{
var sql = require ('mssql');
const config = {
user: 'sa',
password: 'password',
server: 'localhost\\SQLEXPRESS',
database: 'xxxxx',
options: {
encrypt: false // Use this if you're on Windows Azure
}
};
var connection = new sql.Connection(config, function(err)
{
var request = new sql.Request(connection);
request.query('select * from Project_Type' , function(err, recordset)
{
callback(recordset);
});
});
}
module.exports = router;
Some more questions:
Is this the right place to start a sql connection ? or should i put in in the app.js file
and other advice as to how to setup the environment and angular to properly speak with the db would be highly appreciated.
I have an application built on Node/Express/Angular.
I have all my angular front end code in a "client" folder and I have all my backend (nodejs & express) in another folder ("server").
I use Grunt to compile the code into the "server/dist" folder, so when I publish to production, I'm just uploading the "server" folder.
I've added a feature to upload images and am using multer to do that.
I've created an "fileuploads" folder in the "server" directory and am successfully uploading files to that folder.
The Problem:
In my app I need to reference the images, but even though I've created a static reference in my server/app.js file, I'm still unable to reach them.
Here is what my server side app.js file looks like:
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 mongoose = require('mongoose');
var cors = require('cors');
var multer = require('multer');
mongoose.connect('mongodb://localhost/OM');
var app = express();
// 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: true }));
app.use(cookieParser());
app.use(cors());
app.use('/api', require('./routes/api'));
app.use('/sendmail', require('./routes/sendmail'));
app.use('/uploads', require('./routes/uploads'));
app.use(express.static(path.join(__dirname, '../client/app/custom')));
app.use(express.static(path.join(__dirname, '/dist')));
app.use(express.static(path.join(__dirname, '/fileuploads')));
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
app.all('/*', function(req, res){
res.sendFile(path.join(__dirname, '/dist/index.html'));
});
module.exports = app;
On the client side, I've tried accessing the files in the following way:
<img src="fileuploads/0d904f4a422ea5a8fcd9a3859b58cdb9" />
<img src="/fileuploads/0d904f4a422ea5a8fcd9a3859b58cdb9" />
<img src="../fileuploads/0d904f4a422ea5a8fcd9a3859b58cdb9" />
But nothing seems to work.
What am I missing?
It will be nice to have
app.use(express.static(path.join(__dirname, '/fileuploads')));
as
app.use('/fileuploads', express.static(path.join(__dirname, '/fileuploads')));
or make it shorter this way:
app.use('/fileuploads', express.static(process.cwd() + '/fileuploads'));
That way, you will be able to access it anywhere in your app as:
<img src="/fileuploads/0d904f4a422ea5a8fcd9a3859b58cdb9" /> which is basically saying "anywhere i call fileuploads, serve me the right path". ^_^
My app.js is as below
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var mongoose = require('mongoose'); //add for Mongo support
mongoose.connect('mongodb://localhost/flapperNews'); //connect to Mongo
var index = require('./routes/index');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.join(__dirname, 'public')));
//rout to views
app.use('/', index);
app.get('/', function (req, res) {
res.send('Application Started');
console.log("Application Started.")
});
app.listen(3000);
module.exports = app;
My Directories are as follows
root -> node_modules -> all resource
root -> public -> javascripts -> angularApp.js
I got the following error
I think, your file angularApp.js is available in this url http://localhost:3000/javascripts/angularApp.js
nodejs normally blocks everything outside the public folder (in root) for the client to see
app.use(express.static(path.join(__dirname, 'public')));
this maps the public folder to: /public
so the client isn't able to access any other directory on your system
you need to change the app.use or the folder ;)
I am serving up angular pages from express. I cannot get prerender to serve up rendered pages for the products:
http://www.minilolo.com/?_escaped_fragment_=/products/Lolo-Pink
But other pages like this one are OK:
http://www.minilolo.com/?_escaped_fragment_=/products
I think I may need to add some express routes, but would like to know if I am on the right track. Thanks!
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();
// 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.set('view engine', 'ejs');
app.use(require('prerender-node').set('prerenderToken', 'xyz123'));
/**
* Development Settings
*/
if (app.get('env') === 'development') {
// This will change in production since we'll be using the dist folder
app.use(express.static(path.join(__dirname, '../client')));
// This covers serving up the index page
app.use(express.static(path.join(__dirname, '../client/.tmp')));
app.use(express.static(path.join(__dirname, '../client/app')));
// Error Handling
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
/**
* Production Settings
*/
if (app.get('env') === 'production') {
// changes it to use the optimized version for production
app.use(express.static(path.join(__dirname, 'dist')));
// added to serve up products pages
app.use(function(req, res) {
// Use res.sendfile, as it streams instead of reading the file into memory.
res.sendfile(__dirname + '/dist/index.html');
});
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
}
module.exports = app;
EDIT: I have tracked down the issue to prerender converting '?_escaped_fragment_=' into '#!'. Angular then doesn't know which route to use unless I have $locationProvider.hashPrefix('!') in place (which I don't want to use). I dont want the # prefix if it can be helped.
2015-09-07T12:17:17.566Z got 200 in 12713ms for http://localhost:3000/#!/products
2015-09-07T12:17:18.773Z Timed out. Sending request with HTML on the page
2015-09-07T12:17:18.785Z got 200 in 12732ms for http://localhost:3000/#!/products
2015-09-07T12:19:04.589Z getting http://localhost:3000/#!/products
As explained on the following links:
https://github.com/prerender/prerender/issues/198
https://developers.google.com/webmasters/ajax-crawling/docs/specification?hl=en
The query from the search has '?_escaped_fragment_=' at the end of the path, rather than straight after the fqdn.
http://www.minilolo.com/?_escaped_fragment_=/products/Lolo-Pink <-- not this
http://www.minilolo.com/products/Lolo-Pink?_escaped_fragment_= <-- this!