When my React app runs a post request I get the "431 (Request Header Fields Too Large)" error and I can't figure out what's causing it. Can anyone help?
Things I've tried based on answers to similar questions:
- Clearing cache and cookies
- Updating node from v12.19.0 to v14.17.2
- Setting header specs in the request
Function from form submitting the POST request:
handleSubmit(evt){
axios.post('/creator/new', {
username: this.state.username,
password: this.state.password,
profilePic: this.state.profilePic,
firstName: this.state.firstName,
lastName: this.state.lastName,
dob: this.state.dob,
country: this.state.country
}, {headers: {
'Accept': 'application/json',
'Content-Type': 'application/json; charset=UTF-8'
}}).then(response => {
console.log('response received');
})
evt.target.reset();
this.props.history.push(`/creator/${this.state.username}`);
this.props.addCreator(this.state);
}
Server:
const express = require('express');
const cors = require('cors');
const creatorsRoutes = require('./routes/creators-routes');
const ipsumsRoutes = require('./routes/ipsums-routes');
const app = express();
app.use(cors());
app.use(express.json());
app.use((req, res, next) => {
console.log('request received')
res.send(req.path);
console.log('request body sent back')
})
app.use('/creator', creatorsRoutes);
const mongoose = require('mongoose');
mongoose.connect("mongodb+srv://SkyeWulff:************retryWrites=true&w=majority", {useNewUrlParser: true, useUnifiedTopology: true})
.then(() => {
console.log('Connection open');
})
.catch(err => {
console.log('Error occured:');
console.log(err);
})
let db = mongoose.connection;
db.on('error', console.error.bind(console, 'Connection Error'));
db.once('open', function(){console.log("successfully connected to MongoDB")});
app.listen(5000, () => {
console.log("listening on port 5000");
})
Router the server is using:
const express = require('express');
const creatorsController = require('../controllers/creators-controllers');
const router = express.Router();
router.get('/creator/id', creatorsController.getCreator);
router.post('/new', creatorsController.addCreator);
module.exports = router;
Controller used by router:
const mongoose = require('mongoose');
const Schema = mongoose.Schema;
const creatorSchema = new Schema({
username: String,
password: String,
profilePic: String,
firstName: String,
lastName: String,
dob: Date,
country: String
});
module.exports = mongoose.model('Creator', creatorSchema);
Filetree Structure: Filetree
