Multiple Query Values in Get Request to JSON based Express Api - json

Question

I have followed this tutorial https://jonathanmh.com/building-a-simple-searchable-api-with-express-backend/. However I can't seem to get it to work even when I copy the source code. I'm not sure if I have done something wrong that I have missed. Basically when using 2 query parameters I get all the records returned in the response. It works with one fine. The api route is
app.get('/api/stores', function(req, res){
var response = [];
console.log(req.query)
// this would usually adjust your database query
if(typeof req.query.nsfw != 'undefined'){
stores.filter(function(store){
if(store.nsfw.toString() == req.query.nsfw){
response.push(store);
}
});
}
// this would usually adjust your database query
if(typeof req.query.location != 'undefined'){
stores.filter(function(store){
if(store.location === req.query.location){
response.push(store);
}
});
}
// de-duplication:
response = _.uniqBy(response, 'id');
// in case no filtering has been applied, respond with all stores
if(Object.keys(req.query).length === 0){
response = stores;
}
res.json(response);
});
The JSON file is
const stores = [
{
id: 1,
name: 'Hollows End Grim Potions',
imageURL: 'https://images.unsplash.com/photo-1465433360938-e02f97448763? auto=format&fit=crop&w=1267&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D',
location: 'Hollows End',
nsfw: true
},
{
id: 2,
name: 'Lembas Food Truck',
imageURL: 'https://images.unsplash.com/reserve/DHHQbqc0RrWVf0uDNe5E_The%20Litte%20Cafe.jpg?auto=format&fit=crop&w=1489&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D',
location: 'Lothlorien',
nsfw: false
},
{
id: 3,
name: 'Galadriels Mirror of Brutal Truth',
imageURL: 'https://images.unsplash.com/photo-1497519098947-a305f214d3bc?auto=format&fit=crop&w=1350&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D',
location: 'Lothlorien',
nsfw: true
},
{
id: 4,
name: 'Jabbas Light Sabers',
imageURL: 'https://images.unsplash.com/photo-1481241857164-e8483bce922d?auto=format&fit=crop&w=1353&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D',
location: 'Mos Eisley',
nsfw: true
}
];
module.exports = stores;
So to reiterate my question- why if I place http://localhost:3000/api/stores?location=Lothlorien&nsfw=true do I not only get id:3? Right now I get all records returned.
EDIT:
I just tried it with http://localhost:3000/api/stores?location=Lothlorien&nsfw=false and I strangely get two records ID:2 & ID:3 when I should only be getting ID:2

Answer 1

You're filtering on the conditions separately and pushing the results of each onto your response array instead of using && to filter both conditions together.
For example when filtering on location=Lothlorien OR nsfw=true, you get 2 results for the location and 3 for the nsfw which uniquely includes 4 (all of them). However, if it had to meet both criteria together, you'd expect to get 1 result - only 1 location named Lothlorien that has nsfw of false.
Here's an example using &&:
const { location=null, nsfw=null } = req.query;
if (location && nsfw) {
stores.filter((store) => {
if(store.nsfw.toString() === nsfw && store.location === location){
response.push(store);
}
});
}

Answer 2

I got here via the link to this page in the comment of the article. I too was wanting the server code to behave differently, so I fiddled around with this a bit and got the results I was looking for. I hope this answers the Original Posters' question. Here is my entire server.js file:
const express = require('express');
const app = express();
const stores = require('./data/stores');
// npm i express-query-boolean
const boolParser = require('express-query-boolean');
app.use(boolParser());
app.get('/', function (req, res) {
res.send('Hello World!')
});
app.get('/api/stores', function (req, res) {
let response = [];
const q = req.query; // Query object
if (Object.keys(q).length === 0) {
// NO query parameters, send it all...
response = stores;
} else {
// We have a query, filter response to match request
response = stores.filter(function (store) {
return Object.keys(this).every((key) => store[key] === this[key]);
}, q);
}
res.json(response);
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!');
});