CODEWITHSUNDEEP
javascriptnode.jsexpress
Aleks Maksiuta
Aleks Maksiuta

Reputation: 49

Redirection to custom url via nodejs and express

I have a problem with redirection. I have a small nodejs/express app that should redirect to external URL with form's input values after submiting form.

index.html

<form method="POST" action="https://192.0.2.1/abc.html">
    <input name="name"/>
    <input name="email"/>
    <button type="submit">
</form>

It's only goes to https://192.0.2.1/abc.html without inputs' values. Please, help.

Upvotes: 2

Views: 1576

Answers (1)

rsp
rsp

Reputation: 111306

Example

I wrote a working example of what you're describing:

'use strict';
var host = '127.0.0.1', port = 3333;
var express = require('express');
var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.urlencoded({extended: true}));
app.get('/', (req, res) => {
  res.type('html').end(`
    <form method="POST" action="http://${host}:${port}/abc.html">
    <input name="name"/>
    <input name="email"/>
    <button type="submit">Submit</button>
    </form>
    <form method="POST" action="http://${host}:${port}/def.html">
    <input name="name"/>
    <input name="email"/>
    <button type="submit">Submit</button>
    </form>
  `);
});
app.post('/abc.html', (req, res) => {
  var name = req.body.name, email = req.body.email;
  res.redirect(`http://${host}:${port}/ghi.html?name=${name}&email=${email}`);
});
app.post('/def.html', (req, res) => {
  res.type('html').end(`
    <p>Name: ${req.body.name}</p>
    <p>Email: ${req.body.email}</p>
  `);
});
app.get('/ghi.html', (req, res) => {
  res.type('html').end(`
    <p>Name: ${req.query.name}</p>
    <p>Email: ${req.query.email}</p>
  `);
});
app.listen(port, () =>
  console.log(`Listening on http://${host}:${port}/`));

Running

You need to install express and body-parser:

npm install express body-parser

And run with:

node app.js

Two forms

The first form correctly passes the parameters via POST method. The POST /abc.html handler has access to them and sends a redirect to a custom URL of the form: /ghi.html?name=xxx&email=yyy - the target of the redirection displays those values in HTML and you can see them in the address bar as well.

The second form doesn't redirect but directly displays the parameters, so that you could better see what's going on. It's also useful to open the Developer Console in your browser and observe the Network activity while you are clicking the form buttons.

Explanation

It's not entirely clear from your example what can be wrong in your code, but I hope that showing you an example code that works will help you diagnose the problem in your implementation.

What you have to keep in mind is that for GET requests with parameters passed in the query string, you access them as:

req.query.name
req.query.email

and for the POST requests with parameters passed in the request body, you have to use body-parser middleware and then you can access them with:

req.body.name
req.body.email

Requests overview

The requests that take place here are:

  1. You access http://127.0.0.1:3333/ and get the HTML with two forms
  2. You enter email aaa for name and bbb for email and submit the first form
  3. Your browser sends a POST request to /abc.html with name=aaa&email=bbb in the body
  4. The server sends a 302 Found response with Location: http://127.0.0.1:3333/ghi.html?name=aaa&email=bbb header
  5. Your browser sends a GET request to: /ghi.html?name=aaa&email=bbb
  6. The server sends a 200 OK response with HTML including the parameters

Upvotes: 1

Related Questions