Request API data into Express view - node.js

Newbie here. I'm trying to send data I received from making making an API call (when the user requests the zoopla page) into an index.ejs view. I'm trying to pass the graph_url by passing it in the res.render.
The graph_url logs correctly, so the API call is coming back, however I get the following error in my terminal:
ReferenceError: graph_url is not defined
Here is my index.js request for the page:
app.get('/zoopla', function(req, res){
request(zoopla, function(err, res, data){
var data = JSON.parse(data);
var graph_url = data.area_values_url
console.log(graph_url);
});
res.render('index', { title : "zoopla", graph : graph_url});
});

graph_url is not defined because is out of the local scope, and also you are trying to render the page before the previous async request() call complete.
try with:
app.get('/zoopla', function(req, res){
request(zoopla, function(err, res, data){
if (err) {
/* handle errors */
}
var data = JSON.parse(data);
var graph_url = data.area_values_url
console.log(graph_url);
res.render('index', { title : "zoopla", graph : graph_url});
});
});

Related

Node, express, Monk, mongodb: 400 bad request error on post request. Why am I getting this error?

I've been trying to get a simple nodejs API with CRUD functionality working. I'm using express, and 'monk' package for communicating with mongodb. I've successfully pulled data with a GET request.
I'm unable to get a post() function to work. I'm able to insert new documents to mongo when the insert request is called from a GET request that inserts a doc every time it's called. However, no matter what I do, with or without an actual insert request, my post is returning a 400.
Here's my route file:
var express = require('express');
var router = express.Router();
/* GET hours page. (for users to submit hours) */
router.get('/', function (req, res) {
var db = req.db;
var collection = db.get('entries');
collection.find({}, /*{limit:20}, */function (err, docs) {
if (err) {
console.log('couldn\'t load entries');
}
res.json(docs);
});
});
/* POST hours page. (for users to submit hours) */
router.post('/', function (req, res) {
if (!(req.body.job || req.body.code || req.body.hours)) {
handleError(res, 'Invalid user input', 'Must complete input', 400);
}
var db = req.db;
var collection = db.get('entries');
var newEntry = req.body;
collection.insert(newEntry, function (err, docs) {
if (err){
handleError(res, err.message, 'Failed to create new entry');
}
res.json(docs);
});
});
module.exports = router;
I really don't know why ever single post request is returning a 400. I'm thinking it's a problem with my main file, but it has barely been altered from the initial express generated file.
You if condition is wrong. !(req.body.job || req.body.code || req.body.hours) should be !(req.body.job && req.body.code && req.body.hours).
And are you sure you have really post anything? Check the Content-Type of your requests, which should be application/x-www-form-urlencoded;.
I recommand using supertest to test your app. The usage is very simple.
import request = require("supertest");
import should = require("should");
import app = require("../youApp");
describe("POST /foo", () => {
it("should post something", done => {
request(app)
.post("/foo")
.send({job: "my job", code: "...", "hours"})
.expect(200, done);
});
});
Somthing more
replace var with const .
use arrow function instead of function(req, res).

rendering JSON in view

I am writing an app in node.js, I have the following code.
API for retrieving topic from DB
allTopics = function (req, res) {
db.Topic.all({limit: 10}).success(function (topics) {
res.send(topics)
});
};
Route for topics index
app.get('/topics', function (req, res){
res.render('topics/index.ejs',{ topics : allTopics })
});
Is the above code correct for route?
Also I have index.ejs file where I want to list all the topics (i.e. retrieve data from json response). How do I achieve this?
Your code as-is won't work but you could rewrite it as follows:
// notice how I am passing a callback rather than req/res
allTopics = function (callback) {
db.Topic.all({limit: 10}).success(function (topics) {
callback(topics);
});
};
// call allTopics and render inside the callback when allTopics()
// has finished. I renamed "allTopics" to "theData" in the callback
// just to make it clear one is the data one is the function.
app.get('/topics', function (req, res){
allTopics(function(theData) {
res.render('topics/index.ejs',{ topics : theData });
});
});

404 error trying to load MEAN web app

So I'm trying to set up a basic Todo list/CRUD application using the MEAN stack (Angular, MongoDB, Nodejs, Express) and I keep running into trouble when I switch around the routes and models in the directory and try to load up the application via node server on my command prompt. When I move anything the error below is what I get via a command prompt error. Just an FYI, I'm a total NOOB.
App listening on port 3000
GET /api/todos 404 2ms
GET /api/todos 500 7ms - 1.36kb
ReferenceError: Todo is not defined
at app.delete.Todo.remove._id (C:\Users\Basel\WebstormProjects\TEST\node-tod
o-tut1-starter\server.js:41:3)
at callbacks (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\no
de_modules\express\lib\router\index.js:164:37)
at param (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\node_m
odules\express\lib\router\index.js:138:11)
at pass (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\node_mo
dules\express\lib\router\index.js:145:5)
at Router._dispatch (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-sta
rter\node_modules\express\lib\router\index.js:173:5)
at Object.router (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starte
r\node_modules\express\lib\router\index.js:33:10)
at next (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\node_mo
dules\express\node_modules\connect\lib\proto.js:193:15)
at Object.methodOverride [as handle] (C:\Users\Basel\WebstormProjects\TEST\n
ode-todo-tut1-starter\node_modules\express\node_modules\connect\lib\middleware\m
ethodOverride.js:48:5)
at next (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\node_mo
dules\express\node_modules\connect\lib\proto.js:193:15)
at multipart (C:\Users\Basel\WebstormProjects\TEST\node-todo-tut1-starter\no
de_modules\express\node_modules\connect\lib\middleware\multipart.js:86:27)
app.post('/api/todos', function(req, res) {
// create a todo, information comes from AJAX request from Angular
Todo.create({
text : req.body.text,
done : false
}, function(err, todo) {
if (err)
res.send(err);
// get and return all the todos after you create another
Todo.find(function(err, todos) {
if (err)
res.send(err)
res.json(todos);
});
});
});
// delete a todo
app.delete('/api/todos/:todo_id', function(req, res) {
Todo.remove({
_id : req.params.todo_id
}, function(err, todo) {
if (err)
res.send(err);
// get and return all the todos after you create another
Todo.find(function(err, todos) {
if (err)
res.send(err)
res.json(todos);
});
});
});
// application -------------------------------------------------------------
app.get('*', function(req, res) {
res.sendfile('./public/index.html'); // load the single view file (angular will handle the page changes on the front-end)
});
(Assuming you send correct _id from client) you have to reconstruct the _id as BSON object.
Do not know what db-driver you use, but in mongoskin it goes like that:
var mongo = require('mongoskin');
var BSON = mongo.BSONPure;
...
var proper_id = BSON.ObjectID(req.params.todo_id)
In mangoose try following:
var todo = Todo.find({_id : req.params.todo_id});
todo.remove(callback(err, todo)); // callback is optional

Using request within routes node / express

I'm playing around with using nodejs as a custom front end for drupal and i'm trying to come up with a way to match the backend menu system, blocks and views with the routing in express.
example route
module.exports = {
'/work': function(req, res){
//get view json for this page
request('http://site.api/casestudies', function(err, response, body){
views_body = JSON.parse(body);
//get node id from alias
request('http://site.api/alias-to-nid' + req.url, function(err, response, body){
body = JSON.parse(body);
var reqUrl = 'http://site.api/rest/api/' + body.path;
request(reqUrl, function(err, response, body){
body = JSON.parse(body);
//get the data we need
var node_title = body.title,
node_body = body.body.und[0].safe_value,
pageclass = 'not-front section-work';
res.render('work', {title: node_title, class:pageclass, node_title:node_title, node_body:node_body, views_body:views_body});
});
});
});
}
}
So, i hit /work and grab the json for the casestudies view that should exist on that page, then i lookup the node id from the /work alias using another request and finally use the node id in yet another nested request call to grab the rest of the json for the page before finally sending it on the the template.
Now - I have a feeling that this is a terrible way to go about this. What should I be doing instead!?

Response headers of previous request affecting current request

The following code is the user-facing part of a new node app we are building:
var loadInvoice = function(req, res, next) {
Invoice.findById(req.params.invoiceId, function (err, invoice) {
if (err) {
res.send(404, 'Page not found');
} else {
req.invoice = invoice;
next();
}
});
};
app.namespace('/invoices/:invoiceId', loadInvoice, function () {
app.get('', function(req, res){
var templateVals = {
//some template data
};
res.render('paymentselection', templateVals);
});
app.post('', function(req, res){
var data = {
// some data for the apiCall
};
someAPI.someRequest(data, function(err, data) {
console.log(res.status());
res.redirect(data.url);
});
});
});
The first method returns a confirmation page where the user presses a button to post to the same url, which triggers a redirect to an external website.
This all works exactly once. Every second request will crash the app with the message Cant set headers after they are sent. After carefull inspection of the code I could find no reason for this to happen so I added the console.log line which indeed confirms the location header has been set. But it is set to the value i got from someAPI on the previous request not the current one.
This makes absolutely no sense to me. I do not store this value anywhere nor do I do caching or persistence of this data in any way.
Does anybody know what could be causing this?
I use express, express-namespace, mogoose and swig
I found out the problem was being caused bij the 'Restler' libaray used within 'someAPI'. I have no idea how this is possible but swapping it out with something else fixed the problem.

Resources