Home > Back-end >  postman (thunder client) can send request but axios cannot
postman (thunder client) can send request but axios cannot

Time:06-30

I am trying to send http requests using axios to my node backend. For some reason, axios keeps returning a 500 (Internal Server Error) even when thunder client (dollar store version of postman) is able to send the request and get a proper response.

index.js (server)

app.get('/api/login', async (req, res) => {
    try {
        const user = await User.findOne({ email: req.body.email })
        if(user===undefined) { res.status(404).json("user not found"); } 
        const validPassword = await bcrypt.compare(req.body.password, user.password)
        !validPassword && res.status(400).json("wrong password")
        res.status(200).json(user)
    } catch (err) {
        res.status(500).json(err)
    }
})

Login.js (frontend)

const login = (email, password) => {
    console.log(email   ': '   password)
    axios.get('http://localhost:8800/api/login', { email: email, password: password })
        .then((response) => console.log(response))
        .catch((err) => console.log(err.response))
}

err.response returns no useful data and err.response.data is a blank object. I've tried to edit the request header, but it is already 'application/json'. Again, this request works on thunder client and I made sure that the data I passed in was correct through the console.log(email ': ' password . I've been trying to fix this issue for hours so please help. Thank you in advance.

Update: I had previously binded the login function to an onClick to a button, but I put the axios function directly into the brackets instead of login(email, password). The issue persists.

Second Update: I followed the comments' advice and console logged the error on the terminal. It returned TypeError: Cannot read properties of null (reading 'password'). This was strange because in the function, I had console logged password and it returned the proper text. It also says that it cannot find a user within my database that uses the email I am currently using, but even when I pass in the exact email I use in thunder client requests, I still get the error. I think the data is not getting there properly.

Third Update: My hypothesis is confirmed. In index.js, I made the route console log req.body.email and it returned undefined. I passed in an object that I JSON stringified and when console logged in the browser, it returns a proper object. The request is sending an object with undefined properties although I am passing in an object with values

CodePudding user response:

In this case, the issue was that the request was a get request, not a post request. Get requests do not take in data while post requests do. Here is the fix:

index.js (server)

app.post('/api/login', async (req, res) => {
    try {
        const user = await User.findOne({ email: req.body.email })
        if(user===undefined) { res.status(404).json("user not found"); } 
        const validPassword = await bcrypt.compare(req.body.password, user.password)
        !validPassword && res.status(400).json("wrong password")
        res.status(200).json(user)
    } catch (err) {
        res.status(500).json(err)
    }
})

CodePudding user response:

If you have to receive the request parameters in body (mainly in json format) then you have to go with POST type request.

In the GET type request, you can get request parameters in the form of params and query string.

Parameters may be either part of path:

myapi/customers/123

or a query string:

myapi?customer=123

More details can be found here: https://www.restapitutorial.com/lessons/httpmethods.html

  • Related