400 error status when exchanging authorization code

Hey all, I am trying to retrieve an authorisation code as per the docs: https://docs.monzo.com/#acquire-an-access-token

I have all the data required to make the request, but am struggling with how to arrange that data in the fetch:

This is what I have so far (as part of a React app):

if (state_token === state) {
      // state matches - retrieve the access token from monzo
      const formData = {
        grant_type: "authorization_code",
        client_id: client_id,
        client_secret: client_secret,
        redirect_uri: authorised_redirect_uri,
        code: authorization_code
      };

      axios
        .post(`${config.monzo.base}/oauth2/token`, formData)
        .then(response => {
          console.log(response);
        })
        .then(data => console.log(data))
        .catch(function(error) {
          console.log(error);
        });
    }

However, this is resulting in a 400 status error. I’m not sure what I’m doing wrong. Any pointers?

Thanks in advance.

Hi @zeKoko

The token endpoint requires the post body to be in a query string format but by default axios converts the data object to JSON.

Try this:

...
const formData = new URLSearchParams();
formData.set("grant_type", "authorization_code");
formData.set("client_id", client_id);
formData.set("client_secret", client_secret);
formData.set("redirect_uri", authorised_redirect_uri);
formData.set("code", authorization_code);

axios
    .post(`${config.monzo.base}/oauth2/token`, formData.toString())
...
1 Like