如何在 React Native 中向 api 发出 POST 请求？

Question

I am trying to make a Post request to an api but for some reason i am getting a 400 feedback in the process. Being that i am a beginner at this, i can't really figure out where i am getting it wrong. I understand 400 error has to do with incorrect syntax but i am not sure that is the case here. I also checked out the other related posts but none helped address my problem. I have also read through the documentation over and over again but still can't see where i am making a mistake. I will appreciate if you helped me point out the problem.

  myPostRequest(){
    
    var mybody = { 
      "amount": "5.0",
      "currency": "EUR",
      "externalId": "6547864",
      "payer": { "partyIdType": "MSISDN","partyId": "0977948551"}
    }
    mybody = JSON.stringify(mybody);
    var token = "mytoken";   
    //POST request 
    fetch('https://sandbox.momodeveloper.mtn.com/collection/v1_0/requesttopay', {
      method: "POST",
      headers: {
        'Authorization': 'Bearer '+token,
        'X-Reference-Id': 'f9b8b0a-XXXXXXXXXX',
        'X-Target-Environment': 'sandbox',
        'Ocp-Apim-Subscription-Key': '14d2a71dXXXXXXXXX',
      },
      body: mybody,
    })
    .then((responseJson) => {
        alert(JSON.stringify(responseJson));
        console.log(responseJson);
    })
    .catch((error) => {
      alert(JSON.stringify(error));
      console.error(error);
    });
  }

Answer 1

Use axios/apisauce instead of fetch

apisauce example:

import { create } from 'apisauce';

const api = create({
  baseURL: `http://example.com`,
});

const response = await api.post('/path/to/', body, { headers });

In your case:

import { create } from 'apisauce';

const api = create({
    baseURL: `https://sandbox.momodeveloper.mtn.com`,
});

const response = await api.post(
    '/collection/v1_0/requesttopay',
    {
        "amount": "5.0",
        "currency": "EUR",
        "externalId": "6547864",
        "payer": { "partyIdType": "MSISDN", "partyId": "0977948551" }
    },
    {
        headers: {
            'Authorization': 'Bearer ' + token,
            'X-Reference-Id': 'f9b8b0a-XXXXXXXXXX',
            'X-Target-Environment': 'sandbox',
            'Ocp-Apim-Subscription-Key': '14d2a71dXXXXXXXXX',
        }
    }
);