Express: req.query is always empty

Question

I have a file that roughly looks like this:

const
    express = require('express'),
    cookieParser = require('cookie-parser'),
    http = require('http'),
    path = require('path'),
    bodyParser = require('body-parser'),
    app = express(),
    server = http.createServer(app);

    app.use(bodyParser.urlencoded({extended: true}));
    app.use(express.static(path.join(__dirname,'./pub')));
    app.use(cookieParser());
    
    app.get('/', (req,res) => {
        res.sendFile(path.join(__dirname,'./index.html'));
    });
    app.post('/test', (req, res) => {
        console.log(req.query); //returns empty object even though it shouldn't
        // does other stuff here
    });
    
    server.listen(3000, function() {
        console.log('server is listening on port: 3000');
    });

Calling foo.bar/test.html?query=foobar returns an html login form that sends the request to the /test route on submit - and I'd expect the output of the console.log above to be { query: "foobar }, but it's empty.

Everything else in the app works as intended (the request for the login, saving the session, etc) with the exception of the query string.

The request form:

<!DOCTYPE html>
<html lang = "en">
<head>
    <meta charset = "UTF-8">
    <title>Login</title>
</head>
<body>

<form action="/test" method="POST">
    <fieldset>

        <label for="email">Email</label>
        <input type ="email" id="email" name="email"        placeholder="[email protected]" required>

        <label for="password">Password</label>
        <input type="password" id="password" name="password" required>

        <button type ="submit">Submit</button>
    </fieldset>
</form>

</body>
</html>

Shouldn't the request be foo.bar/test?query=foobar ? Like this, it points to the html file which is statically served.. — user8018716
– user8018716, Commented Dec 8, 2021 at 16:41
The test.html file is basically a login form that performs a request to the test route. The route correctly receives the request, the user can log in and the session is saved correctly. The only thing that's weird with the request it receives is that the query is empty. The correct URL is in the req.rawHeaders for example, but it would be pretty unreliable to filter the rawHeaders array for the URL and then filter the query... — Karliah
– Karliah, Commented Dec 8, 2021 at 16:49

user8018716user8018716 · Accepted Answer · 2021-12-08 17:13:13Z

1

When doing a request using a html form, the props can be accessed using req.body . The data is not sent using querystring (so it's not added to the url) but added to the request payload.

Here's code to read out the data from request.

app.post('/test', (req, res) => {
    console.log('in login:')
    console.log(JSON.stringify(req.body)); // use req.body since there's no querystring.
    res.status(200).send('Login succeeded for user ' + req.body.email)
});

answered Dec 8, 2021 at 17:13

user8018716

Sign up to request clarification or add additional context in comments.

5 Comments

Karliah Over a year ago

Ah, I'm sorry - I edited the variable & file names to simplify/censor the code and forgot to rename the /login to /test, I've fixed the question now. What I want to access is the query string from the URL though.

user8018716 Over a year ago

I fixed the answer aswell ;)

Karliah Over a year ago

If I call foo.bar/test.html?query=foobar, I should be able to access the query=foobar part with req.query (but it's just an empty object), or am I missing something?

user8018716 Over a year ago

When you do a request using fetch OR xhttp Request to the url foo.bar/test?query=foobar (note no .html...) Then you should be able to access req.params.query. But with forms it does not work. Forms will always put the data into request payload when doing POST. I don't get your question.

Karliah Over a year ago

As you can probably tell, I'm pretty new to express and handling the requests, but I understood what you meant now. I'll try to change my code so I can call foo.bar/test?query=foobar without .html tomorrow :)

Dharman · Accepted Answer · 2021-12-08 17:01:36Z

0

Here are the possible solutions that you can try:

Make sure when you test the API, you use POST method since you have used POST method in the route.

Also, the API URL should be of the form http://localhost:3000/user?name=Karliah. This should print { name : 'Karliah'}

edited Dec 8, 2021 at 17:01

Dharman♦

33.9k27 gold badges103 silver badges153 bronze badges

answered Dec 8, 2021 at 16:55

Aditya

4703 silver badges16 bronze badges

1 Comment

Karliah Over a year ago

It is a post method (I've added an html code snippet to the question :) ), basically I just call the html document that has a login form and the /login request is called on submit, so I think the URL is correct the way it was? Removing the .html in the URL gives me the error "Cannot GET /test"

Karliah · Accepted Answer · 2021-12-13 10:19:58Z

app.get('/test', (req,res) => {
    app.set('source', req.query.source);
    res.sendFile(path.join(__dirname,'./pub/test.html'));
});

Inserting this to the file mentioned in the question adds a "source" variable that can be accessed in the POST request:

app.post('/test', (req, res) => {
    console.log(req.app.get('source')); //returns the value
    // does other stuff here
});

The URL I call does not use the .html anymore: before: foo.bar/test.html?source=123 after: foo.bar/test?source=123

Collectives™ on Stack Overflow

Express: req.query is always empty

3 Answers 3

5 Comments

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

Comments

Related