I haved used axios.delete() to excute delete in frontend ,code like below
Axios({
method: 'DELETE',
url:'http://localhost:3001/delete',
params: {
id:id,
category:category
}
})
And I used koa-router to parse my request in backend ,but I can't get my query params.
const deleteOneComment = (ctx,next) =>{
let deleteItem = ctx.params;
let id = deleteItem.id;
let category = deleteItem.category;
console.log(ctx.params);
try {
db.collection(category+'mds').deleteOne( { "_id" : ObjectId(id) } );
}
route.delete('/delete',deleteOneComment)
Could anyone give me a hand ?
Basically, I think you misunderstood context.params and query string.
I assume that you are using koa-router. With koa-router, a params object is added to the koa context, and it provides access to named route parameters. For example, if you declare your route with a named parameter id, you can access it via params:
router.get('/delete/:id', (ctx, next) => {
console.log(ctx.params);
// => { id: '[the id here]' }
});
To get the query string pass through the HTTP body, you need to use ctx.request.query, which ctx.request is koa request object.
Another thing you should be aware with your code is essentially, a http delete request is not recommended to have a body, which mean you should not pass a params with it.
You can use ctx.query and then the name of the value you need.
For instance, for the given url:
https://hey.com?id=123
You can access the property id with ctx.query.id.
router.use("/api/test", async (ctx, next) => {
const id = ctx.query.id
ctx.body = {
id
}
});
per koa documentation ctx.request.query
Related
I was trying to send put request using axios to update information about a book in mongodb, the code is working fine when using postman but it is not working using axios.put used inside react component when submitting, while axios.delete is working fine. I think the problem is that sending the query object in that way is not the right way but I am not able to find the solution.
This is the function that handleSubmit,
the 'id' is the id of the book
'updates' is a state object that contains all the changes that should happen in the book data.
And the second function handleChange is the function that setupdates according to changes in the inputs
const handleSubmit = async (e) => {
e.preventDefault();
try {
const res = await axios.put("http://localhost:8000/book/edit/" + id, {
params: {
updates,
},
});
setNewBook(res.data)
} catch (err) {
console.log(err);
}
};
const handleChange = (e) => {
e.preventDefault();
const value = e.target.value;
setUpdates({
...updates,
[e.target.name]: value,
});
};
maybe you misunderstood the axios put method. as per the axios docs provided (https://github.com/axios/axios#axiosputurl-data-config) the correct structure is axios.put(url[, data[, config]])
The first parameter is URL
The second parameter is data (body request).
3rd parameter is config (you leave params in this parameter)
It should be like this
const res = await axios.put("http://localhost:8000/book/edit/" + id, null, {
params: {
updates,
},
});
I hope this can help you
I am trying to return a user list on a component from my backend and I am having trouble passing my userID param back. I am using useEffect to pull the data from Redux then call an action on the component with what I think is the declared param. The correct userID is being passed correctly as far as I can see however I think the error is occuring when the route is passed the param.
In my action how should I pass the param of the userID that I want to get the data for? I have console.log the param.id/param.userID/userID etc. In the component I have the user.userID (from useSelector) however in the action folder I don't know how to pass it to the backend.
Also in the backend do I always have to set my params as id? can these have the same name as the value on the front-end such as 'userID'? I can only seem to get the backend Postman calls working with :id.
component
const user = useSelector(state => state.auth.user);
const [userDiveLog, setUserDiveLog] = useState({
user: [],
userDiveLogList: [],
expanded: false
})
// get access to dispatch
const dispatch = useDispatch();
useEffect(() => {
dispatch(fetchUserDiveLog(user.userID));
}, []);
action
// pulls the user dive log
export function fetchUserDiveLog(params, credentials, diveLogUserList){
return function(dispatch){
return axios.get("http://localhost:5002/api/divelog/userdiveloglist/" + params.userID)
.then(({data}) => {
dispatch(userDiveLogList(data));
});
};
}
Backend
route
// return an individual dive log
app.get('/api/divelog/userdiveloglist/:userID', controller.userDiveLog);
controller
exports.userDiveLog = (req, res, params, userID) => {
try {
const userID = req.params.userID
diveLog.findAll({
include: {all: true},
where: {diverUserNumber: userID}
})
.then(diveLog => {
const userDiveLogList = [];
for (i = 0; i < diveLog.length; i++) {
userDiveLogList.push(diveLog[i].dataValues);
}
if (!userDiveLogList) {
return res.status(404).send({message: "No dive logs belonging to this user"});
}
res.status(200).send({
data: userDiveLogList
})
})
} catch(err) {
res.status(500).send({
message: "Error retrieving dive log belonging to user id= " + id
});
}
};
Frontend
You're passing the user id (user.userID - a string) to the fetchUserDiveLog function but you're treating it like a params object with the userID property inside the function. params.userID returns undefined since params is a string (it holds the user id). Rename params to userId and add it to the URL.
You can also remove the credentials and diveLogUserList arguments from the fetchUserDiveLog function since they aren't used.
export function fetchUserDiveLog(userId) {
return (dispatch) => {
return axios
.get(`http://localhost:5002/api/divelog/userdiveloglist/${userId}`)
.then(({ data }) => {
dispatch(userDiveLogList(data))
})
}
}
Btw, you shouldn't hardcode the API URL. Use environment variables. If you're using Create React App, you can add environment variables prefixed with REACT_APP_ to .env or you can use dotenv-webpack if you have a custom Webpack setup.
Backend
There are a few issues with the backend code.
The userDiveLog function receives the next function as the third argument but it is named params which is confusing. Since you don't need the next function in the request handler, you should remove the params and userID arguments from the function. You can get access to userID from the req.params object which you're doing correctly.
exports.userDiveLog = (req, res) => {
// ...
}
The if (!userDiveLogList) condition will never be true since userDiveLogList is an array which is truthy in JavaScript. You can actually remove the if block. A response of { data: [] } will be sent if the user doesn't have any Divelogs which is perfectly okay. You can also omit the status(200) call since the status is automatically set to 200. And you can refactor the code by using object destructuring and Array.prototype.map to transform the divelogs.
const { userID } = req.params
const diveLogs = await diveLog.findAll({
include: { all: true },
where: { diverUserNumber: userID },
})
const data = diveLogs.map((log) => log.dataValues)
res.send({ data })
The catch block references the variable id which isn't defined anywhere. It should be userID instead.
The whole code using async/await:
exports.userDiveLog = async (req, res) => {
const { userID } = req.params
try {
const diveLogs = await diveLog.findAll({
include: { all: true },
where: { diverUserNumber: userID },
})
const data = diveLogs.map((log) => log.dataValues)
res.send({ data })
} catch () {
res.status(500).send({
message: `Error retrieving dive log belonging to user id= ${userID}`,
})
}
}
I have identified two questions after reading the description and I am going to answer each of those at a time.
Do I have to set the query parameter as Id?
No, there are no restrictions on the name of query parameter. You can literally name it as "something".
That said, there are some conventions and those dictate that you need to name the parameter to something that is appropriate.
How do I pass userId to my Action Creator?
First of all check the Function that is wrapping your Thunk. It expects 3 parameters: params (POORLY NAMED), credentials and diveLogUserList.
Where as, it is being dispatched with only 1 argument: userID.
Reconfigure this Wrapper Function to just receive the userID as an argument (and send credentials, diveUserList as an extra argument to the Thunk and not the wrapper function; This depends upon the functionality that you desire which is not properly understandable using the Description that you have provided).
After you reconfigured the wrapper function, you will dispatch the same like this:
fetchUserDiveLog(userID).
The Function handling your Route is incorrect
If I am not mistaken, controller.userDiveLog should only receive 3 arguments yet, you have defined your handler with 4 parameters.
The arguments that your handler should expect are: request, response and next.
The User ID that your handler expects will be a query parameter and will be accessible using: request.params.userID.
There is no need to expect userID as an argument to your handler.
Additional Information
I recommend going through these to get a better explanation and along with that, I recommend use of console.log as a method to debug the code. It will help you identify problems such as:
How many arguments is this function receiving?
What is the type of the argument received?
And much more
References
Route Function or Route Handler
Route Parameters
Sending Extra Argument to a Thunk
express and knex are beating me a little; I can't make this endpoint work using req.querys (response from express), even though I made one with req.params and it was ok.
Express:
app.get(`/actor`, async (req: Request, res: Response) => {
try {
// const { gender } = req.query;
const count = await getActorsByGender(req.query.gender as string);
console.log({ count });
res.status(200).send({ quantity: count, });
} catch (error) {
res.status(200).send({ message: error.sqlMessage || error.message });
}
});
Knex requisition:
const getActorsByGender = async (gender: string): Promise<any> => {
try {
const result = await connection.raw(`
SELECT COUNT(*) as count FROM Actor
WHERE gender = "${gender}"
`);
// console.log(`Temos: ${result[0][0].count} ocorrências`);
return result;
} catch (error) {
console.log(error);
}
};
This might be because of the count(), but I'm not sure. The knex part is ok; I can console.log() the result.
The express part showed a empty object on insomnia
Using 'male' as parameter it was expected to return "2" as result.
Your sending male as a route/path parameter since you use http://localhost:3000/actor/male.
If you want to access it as a query-param, you can leave your code as it is, but you need to change your request-url to http://localhost:3000/actor?gender=male
Note that ff you wanted to define gender as a route-parameter, you'd need to change your route-handler to app.get("/actor/:gender") and access it using req.params.gender.
You are using path param in insomnia, not query param
If you want to use query params, you have to remove /male from the URL, and add query param key and value below the URL.
You could also change the URL to locahost:3000/actor?gender=male
Let's say I have a route /ressource. I can call this route with a query parameter /ressource?param=ABCwhich I can retrieve in Node with:
app.get('/ressource', function (req, res) {
const parameter = req.query.param
})
Now, is there a predefined way I can require the parameter which throws an error for request to /ressource without ?param=ABC.
You can use req.query to get the query parameter and use next callback function to throw an error like
app.get('/ressource', function (req, res, next) {
if(!req.query.param) {
const err = new Error('Required query params missing');
err.status = 400;
next(err);
}
// continue
const parameter = req.body.param
})
In express, query is automatically parsed and put into the req.query object, not the req.param object.
So you can access it like this:
const parameter = req.query.parameter;
read req.query on expressjs docs.
There are no predefined way to.
You can choose to check it yourself inside the callback function:
if (!req.query.parameter) {
res.send('parameter is missing');
}
or to use a router middleware which would serve the same purpose
I'm working on a project that requires me to:
GET IDs from API1, push the IDs into an array, then map over those IDs, using them for a second GET request, where IDs are used as params for API2 GET request, populates an array with IDs or N for "Not existing" -- this array is then called in:
A POST request. This post maps over the returned array from the GET request. IF the item is not "N", it POSTS to API1 with checked: true. IF the item is "N", it emails us telling us API2 is missing this project.
I want this system to automatically do a GET and POST every 2 hours, so I'm using setInterval (not sure this is the best idea). EDIT: Cron job would be a better solution.
I'm working with NodeJS, Express, Request-Promise, Async / Await.
Here is some of my pseudo code so far:
// Dependencies
const express = require('express');
const axios = require('axios');
const mailgun = require('mailgun-js')({ apiKey, domain });
// Static
const app = express();
app.get('/', (req, res, next) => {
// Replace setInterval with Cron job in deployment
// Get All Ids
const orders = await getGCloud();
// Check if IDs exist in other API
const validations = await getProjectManagementSystem(orders);
// If they exist, POST update to check, else, mailer
validations.map(id => {
if (id !== 'n') {
postGCloud(id);
} else {
mailer(id);
}
});
}
// Method gets all IDs
const getGCloud = async () => {
try {
let orders = [];
const response = await axios.get('gCloudURL');
for (let key in response) {
orders.push(response.key);
}
return orders;
} catch (error) {
console.log('Error: ', error);
}
}
// Method does a GET requst for each ID
const getProjectManagementSystem = async orders => {
try {
let idArr = [];
orders.map(id => {
let response = await axios.get(`projectManagementSystemURL/${id}`);
response === '404' ? idArr.push('n') : idArr.push(response)
})
return idArr;
} catch (error) {
console.log('Error: ', error);
}
}
const postGCloud = id => {
axios.post('/gcloudURL', {
id,
checked: true
})
.then(res => console.log(res))
.catch(err => console.log(err))
}
const mailer = id => {
const data = {
from: 'TESTER <test#test.com>',
to: 'customerSuppoer#test.com',
subject: `Missing Order: ${id}`,
text: `Our Project Management System is missing ${id}. Please contact client.`
}
mailgun.messages().send(data, (err, body) => {
if (err) {
console.log('Error: ', err)
} else {
console.log('Body: ', body);
}
});
}
app.listen(6000, () => console.log('LISTENING ON 6000'));
The TL;DR: Need to do a GET request to API 1, then another GET request to API 2 following it (using IDs from API 1 as params), then send data from second GET to a POST request that then either updates API 1's data or emails Customer support. This is an automatic system that runs every two hours.
Main Questions:
1. Is it okay to have a setInterval in a get req?
2. Can I have a GET request automatically call a POST request?
3. If so, how can I pass GET request data onto a POST request?
To make it work for both of your calls one post and one get you have to do an Ajax call to get post processed information in another method.
I hope this works.