MrManny MrManny - 2 months ago 9
TypeScript Question

View Engine Error in Node/Angular 2 App

I'm currently trying to upload files to a server using the XMLHttpRequest protocol in Angular 2. So far as data is being transferred from the client to the server I run into the this error:

POST /upload_file 500 54.155 ms - 1398
Error: Failed to lookup view "error" in views directory "C:\Users\...\Documents\right-track\server"
at EventEmitter.render (C:\Users\...\Documents\right-track\server\node_modules\express\lib\application.js:579:17)
at ServerResponse.render (C:\Users\...\Documents\right-track\server\node_modules\express\lib\response.js:961:7)
at C:\Users\...\Documents\right-track\server\server.js:56:7
at Layer.handle_error (C:\Users\...\Documents\right-track\server\node_modules\express\lib\router\layer.js:71:5)
at trim_prefix (C:\Users\e...\Documents\right-track\server\node_modules\express\lib\router\index.js:310:13)
at C:\Users\...\Documents\right-track\server\node_modules\express\lib\router\index.js:280:7
at Function.process_params (C:\Users\...\Documents\right-track\server\node_modules\express\lib\router\index.js:330:12)
at IncomingMessage.next (C:\Users\...\Documents\right-track\server\node_modules\express\lib\router\index.js:271:10)
at done (C:\Users\...\Documents\right-track\server\node_modules\express\lib\response.js:956:25)
at EventEmitter.render (C:\Users\...\Documents\right-track\server\node_modules\express\lib\application.js:581:14)


I don't think I'm meant to even use an 'error' view since it's a single page app. Here is how I setup the node server:

//Set view engine
app.set('views', path.join(__dirname, ''));
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);

// 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(cors());

app.use('/', routes);
app.use('/users', users);
app.use('/upload', upload);

// 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);
res.render('error', {
message: err.message,
error: {}
});
});

var port = process.env.PORT || 5000;

app.listen(port, function(){
console.log('Server running on port '+ port+'...');
})

module.exports = app;


--Upload.js

// POST - Upload File

router.post('/upload_file',upload.array("upload", 12),function(req, res){
res.render('showcase');
//res.status(200).send(req.files);
console.log(file);
})

Answer
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

Far as I can tell that will always throw an error on every request. Then the next handler tries to render with the 'error' view which does not exist.

Review how middleware works. You may be able to find a good existing template or framework for setting up an Angular 2 SPA with Node.

Comments