React axios calls to node.js gives empty {} on req.body

Question

I am trying to pass in the two ids(book_id, user_id) from axios to node.js. When I console.log(req.body) it gives me empty object.

When console.log("bookid", book_id, "user", user_id) from axios. It returns:

When I console.log

app.delete('/mypage', function(req, res, next) {
    console.log("req.body", req.body)
    db.delete_mylist([req.body.book_id], function(err, individual) {


        if(err) res.status(500).send(err);
        else {
            db.get_mypage_book(function(err, all) {
                if(err) res.status(500).send(err);
                else res.send(all);
            });
        }
    });
});

It gives me this

Not sure what I am doing wrong here. It worked on the app.post but it doesn't seem to give me anything on app.delete.

action.js

import axios from 'axios';

export const BOOK_SELECTED = 'BOOK_SELECTED';
export const GET_BOOKS = 'GET_BOOKS';
export const SIGN_UP_USER = 'SIGN_UP_USER';
export const LOGIN_USER = 'LOGIN_USER';
export const ADD_MYPAGE = 'ADD_MYPAGE';
export const GET_MYPAGE = 'GET_MYPAGE';
export const DELETE_BOOK = 'DELETE_BOOK';
export const LOGOUT_USER = 'LOGOUT_USER';


const ROOT_URL = 'http://localhost:3000/';

export function deleteBook(book_id, user_id) {
    console.log("bookid", book_id, "user", user_id);
    const request = axios.delete(`${ROOT_URL}mypage`, book_id, user_id);
    return {
        type: DELETE_BOOK,
        payload: request
    }
}

Node.js

const express = require('express');
const bodyParser = require('body-parser');
const session = require('express-session');
const cors = require('cors');
const massive = require('massive');
const config = require('./config');
const app = module.exports = express();

const mass = massive.connectSync({connectionString: config.connectionString});

app.use(bodyParser.json());
app.use(cors());

//db settings
app.set('db', mass);
let db = app.get('db');

//The Controller for the server.js
const controller = require('./mainCtrl.js');


app.get('/books', controller.GetBooks);
app.get('/books/:id', controller.GetBook);
app.get('/mypage/:id', controller.GetMyPage);

app.delete('/mypage', function(req, res, next) {
    console.log("req.body", req.body)
    db.delete_mylist([req.body.book_id], function(err, individual) {


        if(err) res.status(500).send(err);
        else {
            db.get_mypage_book(function(err, all) {
                if(err) res.status(500).send(err);
                else res.send(all);
            });
        }
    });
});

Answer 1

It doesn't look like axios supports sending data in the body with delete https://github.com/mzabriskie/axios#request-method-aliases

While it's not forbidden in the HTTP specs, you shouldn't be sending any data with the body in a DELETE request. Instead, use route parameters:

app.delete('/mypage/:bookId', function(req, res, next) {...});