I would like to know how can I use JSON Vulnerability Protection with express.js.
http://haacked.com/archive/2008/11/20/anatomy-of-a-subtle-json-vulnerability.aspx
The problem is I used to write res.send(jsonObj) from controllers, which will sent data directly to the client.
But I want to intercept the response and modify it with something and send to the client. The client can then undo the modification and retrieve the original data.
I saw the res.format function, but it is not working as for my need.
I was using res.json instead of res.send to send JSON, so I modified the code from your answer thus:
app.use(function (req, res, next) {
res.json = function (data) {
var strData = typeof data == 'object' ? JSON.stringify(data) : data;
strData = expressOptions.jsonPrefix + strData;
res.set('Content-Type', 'text/json');
res.send.call(res, strData);
};
next();
});
Although I've implemented this "just to be sure", I don't think this is a serious vulnerability. If you read this, which is linked from this (which is where I think you got your inspiration to write your Express middleware), it seems that the JSON Vulnerability doesn't exist in "modern" browsers, as in, as far back as IE 6 and FireFox 3.
So I'm not sure why AngularJS is telling people to implement this protection these days. Would appreciate if someone enlightened me in the comments! :)
Finally I ended up doing this:
app.use(function (req, res, next){
var actualSend = res.send;
res.send = function (data) {
if (typeof data == "object") {
var strData = expressOptions.jsonPrefix + JSON.stringify(data);
res.set('Content-Type', 'text/json');
actualSend.call (res, strData);
} else {
actualSend.call (res, data);
}
};
next();
});
Where expressOptions.jsonPrefix is the prefix I wanted.
I added it before my route configurations.
Related
I try to implement a WooCommerce webhook functionality for feathers. To authenticate the request I need to verify the signature of the raw request body like so
const isSignatureValid = (
secret: string,
body: any,
signature?: string
): boolean => {
const signatureComputed = crypto
.createHmac("SHA256", secret)
.update(new Buffer(JSON.stringify(body), "utf8"))
.digest("base64");
return signatureComputed === signature ? true : false;
};
Currently my signature never verifies. My guess is that this is due to the fact that req.body is not the acutual raw body of the request but some already parsed version with some featherjs goodness added.
Question is: How do I obtain the raw request body in a standard feathers app (created with feathers cli)?
Not sure if this is the most idiomatic way to do this, but I came up with the following:
In of express.json() in the main app.ts file it is possible to add the raw, unparsed body to the req object. This is handy, as for some webhooks (woocommerce, stripe), you only need the raw body to verifiy the signature, but otherwise work with the parsed JSON.
export interface IRequestRawBody extends http.IncomingMessage {
rawBody: Buffer;
}
app.use(
express.json({
verify: (req: IRequestRawBody, res, buf) => {
const rawEndpoints: string[] = ["/wc-webhook"];
if (req.url && rawEndpoints.includes(req.url)) {
req.rawBody = buf;
}
}
})
);
// Initialize our service with any options it requires
app.use('/country', function (req, res, next) {
console.log(req);
next();
}, new Country(options, app)
);
We can get request body as above in the express middleware of service class.
This is an extension of the original answer from #florian-norbert-bepunkt since for me it didn't work out of the box... I also needed a string version of the body in order to calculate the security hash.
app.use(express.json({
verify: (req, res, buf) => {
const rawEndpoints = ["/someAPI"];
if (req.url && rawEndpoints.includes(req.url)) {
req.feathers = {dataRawBuffer: buf};
}
}
}));
After that, you can access the original buffer from context as
context.params.dataRawBuffer
I can confirm that this works on feathersJS v4, maybe this will help someone.
I'm running this little node express server, which is supposed to check if the voucher is valid later and then send an answer back to the client
this is my code
app.post('/voucher', function (request, response) {
response.setHeader('Access-Control-Allow-Origin', '*');
response.setHeader('Access-Control-Request-Method', '*');
response.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET');
response.setHeader('Access-Control-Allow-Headers', 'authorization, content-type');
if ( request.method === 'OPTIONS' ) {
response.writeHead(200);
response.end();
return;
}
console.log(request)
let results;
let body = [];
request.on('data', function(chunk) {
body.push(chunk);
}).on('end', function() {
results = Buffer.concat(body).toString();
// results = JSON.parse(results);
console.log('#### CHECKING VOUCHER ####', results)
let success = {success: true, voucher: {name: results,
xxx: 10}}
success = qs.escape(JSON.stringify(success))
response.end(success)
} )
}
);
It is obviously just an example and the actual check is not implemented yet. So far so good.
Now on the client side where I work with REACT, I can not seem to decode the string I just send there.
there I'm doing this
var voucherchecker = $.post('http://localhost:8080/voucher', code , function(res) {
console.log(res)
let x = JSON.parse(res)
console.log(x)
console.log(qs.unescape(x))
It gives me the error
Uncaught SyntaxError: Unexpected token % in JSON at position 0
When I do it the other way arround
let x = qs.unescape(res)
console.log(x)
console.log(JSON.parse(x))
Than it tells me
Uncaught TypeError: _querystring2.default.unescape is not a function
Maybe you can help me? I don't know what the issue is here. Thank you.
Also another question on this behalf, since I'm only a beginner. Is there smarter ways to do such things than I'm doing it now? I have react which renders on the client and I have a mini express server which interacts a few times with it during the payment process.
The both run on different ports.
What would be the standard way or best practice to do such things?
I'm a bit perplexed as to why your backend code has so much going on in the request.
Since you asked for if there is a different way to write this, I will share with you how I would write it.
Server
It seems that you want your requests to enable CORS, it also seems that you originally wanted to parse a JSON in your request body.
This is how I would recommend you re-write your endpoint
POST /voucher to take a request with body JSON
{
code: "xxxxx"
}
and respond with
{
success: true,
voucher: {
name: results,
xxx: 10
}
}
I would recommend you use express's middleware feature as you will probably use CORS and parse JSON in most your requests so in your project I would.
npm install body-parser
npm install cors
then in your app initialization
var bodyParser = require('body-parser')
var cors = require('cors')
var app = express()
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json you can choose to just pars raw text as well
app.use(bodyParser.json())
// this will set Access-Control-Allow-Origin * similar for all response headers
app.use(cors())
You can read more about body-parser and cors in their respective repos, if you don't want to use them I would still recommend you use your own middleware in order to reduse future redundancy in your code.
So far this will substitute this part of your code
response.setHeader('Access-Control-Allow-Origin', '*');
response.setHeader('Access-Control-Request-Method', '*');
response.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET');
response.setHeader('Access-Control-Allow-Headers', 'authorization, content-type');
if ( request.method === 'OPTIONS' ) {
response.writeHead(200);
response.end();
return;
}
console.log(request)
let results;
let body = [];
request.on('data', function(chunk) {
body.push(chunk);
}).on('end', function() {
results = Buffer.concat(body).toString();
// results = JSON.parse(results);
Now your route definition can just be
app.post('/voucher', function (request, response) {
var result = request.body.code // added by body-parser
console.log('#### CHECKING VOUCHER ####', result)
// express 4+ is smart enough to send this as json
response.status(200).send({
success: true,
voucher: {
name: results,
xxx: 10
}
})
})
Client
your client side can then be, assuming $ is jquery's post function
var body = {
code: code
}
$.post('http://localhost:8080/voucher', body).then(function(res) {
console.log(res)
console.log(res.data)
return res.data
})
I'm writing code that would fetch some JSON data and pass it on to a new view with the given data.
The view is called /newbook2 and I want to pass information such as book name, author name and so on to the view from a JSON file called through an API.
var s_book_name;
var s_author_name;
var s_isbn13_id;
var s_publisher_name;
var s_category_id;
var error="";
router.post('/searchbook', function(req, res){
var isbn=req.body.isbn;
var url="http://isbndb.com/api/v2/json/63JEP95R/book/"+isbn;
request({
url: url,
json: true
}, function (error, response, body) {
if (!error && response.statusCode === 200) {
if(body.data[0].title!=null)
s_book_name=body.data[0].title;
if(body.data[0].author_data[0]!=null)
s_author_name=body.data[0].author_data[0].name;
if(body.data[0].isbn13!=null)
s_isbn13_id=body.data[0].isbn13;
if(body.data[0].publisher_name!=null)
s_publisher_name=body.data[0].publisher_name;
if(body.data[0].subject_ids[0]!=null)
s_category_id=body.data[0].subject_ids[0];
}
else error="Book not found. Please enter the information manually."
});
res.redirect('/newbook2');
});
However, the information insn't yet loaded in my view. It seems like a common problem with asynchronous calls. However, I'm new to nodejs and would appreciate any help on how to fix it.
router.get('/newbook2', function(req, res){
res.render('newbook2', {title: 'Add New Book',s_book: s_book_name, s_author: s_author_name, s_isbn13: s_isbn13_id ,s_publisher: s_publisher_name , s_category: s_category_id});
});
You need to use promises for this. Here is some sample code for you to refer to make the POST call.
router.post('/newBook', function(req, res, next) {
console.log('Please add your here to get the data from server');
Obj.then(function() {
res.send('You got the success response from the server');
});
});
res.send('Your Book has been successfully added.'); will only execute after you get the success response from the server.
Please go through the concept of promises for more detail.
I have a an exports function I'm calling that should return a json array of draft results. In the route below in app.js, when I console.log draft_results, I get undefined
app.get('/draft-results', function(req, res) {
var draft_results = fantasy.getDraftResults(req, res);
console.log(util.inspect(draft_results, false, null));
//looks in views folder by default
res.render('draft-results', {
draft_results: draft_results
});
});
In my other file, this is the function that should be returning the json array. If i console.log draft, the data is there.
exports.getDraftResults = function(req, res, cb) {
oauth.get(
"http://fantasysports.yahooapis.com/fantasy/v2/league/" + conf.LEAGUE_ID + "/draftresults?format=json",
req.user.accessToken,
req.user.tokenSecret,
function(e, data, resp) {
if (e) console.error(e);
data = JSON.parse(data);
var draft = data.fantasy_content.league[1].draft_results;
res.json(draft);
}
);
};
I feel like I am returning the data incorrectly, and I can't seem to find any other good examples out there. Could someone please assist?
getDraftResults() is asynchronous. That means the results it generates occur sometime later. Thus, it cannot return its results directly from the function like you are trying to use.
It is unclear what you want to be doing here. Inside of getDraftResults() you are creating a JSON response back to the web request that started all this. That, in itself would be fine and will work as you have it (except the error handling is missing).
But, in your app.get() handler, you have completely different code that seems to thing that getDraftResults() is going to return a value (it has no return value at all) and then you will later use that return value.
So, if you just want getDraftResults to make a JSON response to the original web request, it's already doing that and you can remove the rest of what you have in the app.get() handler. If that's not really what you want to do and you want to use the response from getDraftResults() inside of the app.get() handler, then you will have to change the design of both functions and likely pass a callback to getDraftResults() so the callback can supply the asynchronous response and you can then continue the rest of the app.get() functionality in that callback.
If you're trying to do the latter, then here's a scaffolding (I don't know exactly what you're trying to accomplish so I can't be too detailed here):
app.get('/draft-results', function(req, res) {
fantasy.getDraftResults(req, function(err, draft_results) {
if (err) {
// send some sort of error response here
console.error(err);
return;
}
console.log(util.inspect(draft_results, false, null));
//looks in views folder by default
res.render('draft-results', {
draft_results: draft_results
});
});
});
exports.getDraftResults = function(req, cb) {
oauth.get(
"http://fantasysports.yahooapis.com/fantasy/v2/league/" + conf.LEAGUE_ID + "/draftresults?format=json",
req.user.accessToken,
req.user.tokenSecret,
function(e, data, resp) {
if (e) {
console.error(e);
cb(e);
return;
}
data = JSON.parse(data);
var draft = data.fantasy_content.league[1].draft_results;
// send results back to caller
cb(null, draft);
}
);
};
So I'm selecting Activities from the mongodb and populating User for each.
var query = Activity.find(query).populate("user");
return query.sort({created:"desc"}).exec(function(err, activities) {
debugger;
if (!err) {
return res.json(activities);
} else {
res.status(400).json(err);
}
});
As you can see I have a debugger; breakpoint is there, When I'm pring activities it prints an array of activities with the user object populated.
Also when I'm calling something like activities[0].toJSON() I get everything good!
But the response comes back with the user property empty !
I looked into the source of express.response.json(OBJ) and saw this line:
var body = JSON.stringify(val, replacer, spaces);
val is my activities
When calling JSON.stringify(activities) it will create a json with an empty user field.. any suggestions ?
Try the lean option. That gives back plain JS objects with no mongoose weirdness. Also, your error handling seems a little awkward, can be simplified.
var query = Activity.find(query).populate("user");
query.sort({created:"desc"}).lean().exec(function(err, activities) {
if (err) return res.status(400).json(err);
res.json(activities);
});
I would go even further, not hard-coding error sending in routes but simply passing along via if (err) return next(err) to error-handling middleware defined elsewhere in your app. You can still set the status, then use detection in your middleware, something like this:
app.use(function(err, req, res, next){
err.status = err.status || 500;
res.status(err.status).json(err);
});