Skip to content

How to send urlencoded data using Axios

Learn how to send urlencoded data using Axios

I had this problem: an API I had to call from a Node.js app was only accepting data using the urlencoded format.

I had to figure out this problem: how to send urlencoded data using Axios?

The first thing we need to do is to install the qs module. It’s a cool querystring parsing and stringifying library with some added security:

npm install qs

Then we need to import the qs module along with the Axios import, of course:

const qs = require('qs')
const axios = require('axios')

If you use ES Modules, use

import qs from 'qs'
import axios from 'axios'

Next, the Axios code. Check my full Axios tutorial if you are not familiar with it.

In short, we need to use the full form for the Axios request. Not axios.post() but axios().

Inside there, we use the stringify() method provided by qs and we wrap the data into it. We then set the content-type header:

axios({
  method: 'post',
  url: 'https://my-api.com',
  data: qs.stringify({
    item1: 'value1',
    item2: 'value2'
  }),
  headers: {
    'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
  }
})
β†’ Download my free JavaScript Handbook!

THE VALLEY OF CODE

THE WEB DEVELOPER's MANUAL

You might be interested in those things I do:

  • Learn to code in THE VALLEY OF CODE, your your web development manual
  • Find a ton of Web Development projects to learn modern tech stacks in practice in THE VALLEY OF CODE PRO
  • I wrote 16 books for beginner software developers, DOWNLOAD THEM NOW
  • Every year I organize a hands-on cohort course coding BOOTCAMP to teach you how to build a complex, modern Web Application in practice (next edition February-March-April-May 2024)
  • Learn how to start a solopreneur business on the Internet with SOLO LAB (next edition in 2024)
  • Find me on X

Related posts that talk about js: