How to make a POST request

1

I’m not sure how to access the data on the backend from a textarea on the client side. I’m using body-parser middleware here is my code.

	<div id='create' class="card">
					<form method ='post'>
					<textarea placeholder="Enter your name"></textarea><br>
					<button type="submit" class="btn btn-primary">Submit</button>
					</form>
				</div>

Back end


//This js file is the main running server

const express = require('express');
const ejs = require('ejs');
const app = express();
const bodyParser = require('body-parser');

//including middleware so we can use post requests
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());


// Template engine for rendering is EJS
app.set('view engine', 'ejs');

//Specifies the directory of the static files to serve
app.use(express.static(__dirname + '/public/'));

//rendering the main home page
app.get('/',(req, res)=>{
	res.render('index');
	
})

// not sure what to do here
app.post('/',(req, res)=>{
	console.log(req.body);
	
});

//Opens a port to listen on
app.listen(3000,()=>{
	console.log('Server is now running...')
});
2

You haven’t specified an action for your form or a formaction on the button

you’d set at least one of these to point to the backend’s URI

3

I’m not sure what you mean, am I just pointing to the server itself? action=’/app.js’

4

I’m tryint to send that post data to my database

const mongodb = require('mongodb');
const MongoClient = mongodb.MongoClient;

// link to the databse connection
const URL = 'mongodb+srv://heyrio:<PASSWORD>@cluster0-7cpbz.mongodb.net/test?retryWrites=true';

// name of the collection
const database = 'Crud-Data';

    // connects to the database
MongoClient.connect(URL, {useNewUrlParser: true}, (error, client)=>{
    if(error){
        return console.log('Could not connect to the database');
    }

    // creates a new collection 
    const db = client.db(database);

    // adds a document to the designated collection
    db.collection('User').insertOne({
        // add user input here
    });


});

note: I’ve just covered my password for this post in the URL string

5

It’s meant to point to the URI of the backend, so wherever your express route is, as an example http://localhost:3000/

6

after I hit the submit button it’s the browser just keepsloading and saying “waiting for local host”

in the node terminal i just get an empty object {}

7

You don’t reply in the express app right now, you should use the response object to reply to the request

Not sure about the logged empty object right now, perhaps see in the network inspector what was actually sent

8

the empty {} in the terminal is just from the console.log(req.body)

Thank you for your help I feel like I’m close :cry:
I’m still not getting how I can access the post data and pass it to the mongodb.js file I have so that I can pass the data into

  db.collection('User').insertOne({
        name: // I want the users data to go here
    });

once I do access the post data can I just store it into a variable and just modules.export

9

Sorry for slow reply, was getting a shower

I saw before which line printed the empty object, but I’m not sure which part caused it to be empty, so it’d be helpful to use the chrome network inspector to view what data was actually POSTed to the app :slight_smile:

After you have the data in your express app, define an exported function in your mongodb.js and require and call it in the express app imo

1 Like
10

0

This problem has been solved by a combination of two things.

1.) I needed to add app.use(bodyParser.urlencoded()) because it was not sent by the form as if it were JSON data.

2.) I needed to add a name to the textarea.

1 Like