SyntaxError: JSON.parse: unexpected end of data" when using Fetch in React.js

I am receiving the following error when attempting to retrieve a JSON response using the Fetch API:

async handleSubmit(event) {
    let responseArray = [];
    const token = localStorage.getItem("token");
    let url = "https://api_sports/api/developSports/?";
    var form = new FormData();
    form.append("destIds", this.state.destID);
    form.append("destInfo", this.state.infoID);
    form.append("destPostal", this.state.postID);

    // Figure out the way to append the data in form
    await fetch(url, {
      method: "POST",
      body: form,
      headers: { "Authorization": `Token ${token}` },
      "mimeType": "multipart/form-data",
    }).then((results) => {
      return results.json()
    }).then(response => {
      console.log("Actual Response: ", response)
      if (response.status === 204) {
        console.log("Response 204: ", response)
        this.setState({ alertMessage: "Success" })
     else if (response.status === "error") {
        console.log("Expected Error : ", response);
            alertMessage: "IPError",
            rangeArray: responseArray[0]
    .catch(err => {
      console.log("Error ", err);

I am able to retrieve the JSON response from two out of four Fetch API calls, but not the other two. I do not see any difference in the front-end code when retrieving the response. Could you please take a look at the code above and help me identify the problem? Thank you!

The issue is that the code is expecting a JSON response from the API, but it is not receiving one for the two failed calls. This could be due to a variety of reasons, such as incorrect API endpoint or incorrect payload data. To further debug, it is recommended to check the server logs to see if any errors are being thrown.