Axios post method requesting with x-www-form-urlencoded content type. See https://axios-http.com/docs/urlencoded

index.js

const axios = require('axios')

/* ... */

const params = new URLSearchParams()
params.append('name', 'Akexorcist')
params.append('age', '28')
params.append('position', 'Android Developer')
params.append('description', 'birthdate=25-12-1989&favourite=coding%20coding%20and%20coding&company=Nextzy%20Technologies&website=http://www.akexorcist.com/')
params.append('awesome', true)

const config = {
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  }
}

axios.post(url, params, config)
  .then((result) => {
    // Do somthing
  })
  .catch((err) => {
    // Do somthing
  })

Thanks!

You should use URLSearchParams() with application/x-www-form-urlencoded according to axios documentation (https://github.com/axios/axios#using-applicationx-www-form-urlencoded-format).

const params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);

Thank you so much!!! It works in React Native

🎉 awesome vanilla js solution

@brunodrugowick Thanks for your time.

1. x-www-form-urlencoded

const queryString = new URLSearchParams();

queryString.append('param1', 'value1');
queryString.append('param2', 'value2');

axios.post('/foo', queryString);

// test
for(const item of queryString){
    console.log(item);
}

/*

["param1", "value1"]
["param2", "value2"]

*/

2. multipart/form-data

const formData = new FormData();

formData.append('param1', 'value1');
formData.append('param2', 'value2');

axios.post('/foo', formData);

// test
for(const item of formData){
    console.log(item);
}

/*

["param1", "value1"]
["param2", "value2"]

*/

Update the sample code follows the @brunodrugowick suggestion

Thanks so much for this. No idea why this was so hard to find. I was using FormData instead of URLSearchParams.

Thank you. Solved my issue.

The following utility function should convert a JSON object form into x-www-form-urlencoded parameters. Seems to be working for me.

form_urlencode: function(form){
        const params = new URLSearchParams();
        for (let key in form) {
               if (form.hasOwnProperty(key)) {
                       params.append(key, form[key]);
                }
        }
        return params;
}

thankssss

you must serialize the query params:
see answer here

// using qs npm module
axios.post(url, qs.stringify(requestBody), config)
  .then((result) => {
    // Do somthing
  })
  .catch((err) => {
    // Do somthing
  })

THAAANKS!

You should use URLSearchParams() with application/x-www-form-urlencoded according to axios documentation (https://github.com/axios/axios#using-applicationx-www-form-urlencoded-format).

const params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);

My maaaan!!!

You don't have to call the append()... just pass in the object like this new URLSearchParams({"foo": "bar"}) - most of the time you'll be dealing with the object containing key-value pairs anyway.

@nikita2206 Does this play nice with inherited properties?

@LMBernardo if hasOwnProperty("propertyFromAParent") returns true for the child then it does

Thanks a lot

Worked like a charm. Thank you!

Awesome thank you! You saved me after 5h of debugging and googling 🙌 👍

Thanks !

👍

👍

import qs from 'qs
and qs.stringify() worked like magic. Thanks for redirecting me to the github page of axios promises. Thanks!

https://axios-http.com/docs/urlencoded

Thank's a lot dude! I've beated the issue for 5 hours and finally solved!

Nice !

Thank you soooo much for this!

Thank you so much for this solution 🙌 🥺

Very much thanks !

nice

Thanks!

nice bro! thi

import qs from 'qs and qs.stringify() worked like magic. Thanks for redirecting me to the github page of axios promises. Thanks!

Exactly what I did, I found it more easier

Thanks ! :)