Angular POST request response is null (yet server returns correct string)

Question

The problem is fairly simple: I am making a request like I have always been doing up until now from my client (angular) to my .net API (3.1). The API is correctly requested and the answer is correctly sent.Yet, when it arrives on my client, the response is null. How is that?

Server side:

[HttpPost]
[Route("api/XXXXXXXX")]
[RequestSizeLimit(4_000_000_000)]
[Microsoft.AspNetCore.Cors.EnableCors]
public string JsonFilterResponse([FromBody] JsonElement jsonresult)
{
    try
    {
        var json = System.Text.Json.JsonSerializer.Serialize(jsonresult);
        if (json != null)
        {
            var savepath = ".//JsonResponses//"; Random rnd = new Random();
            var id = rnd.Next().ToString();
            var filePath = Path.Combine(savepath, id); 

            System.IO.File.WriteAllText(filePath, json);

            // return job complete

            Response.Body.Flush(); // http response
            Ok();
            return id; // server response --> the id of the file created
        }
        else
        {
            NotFound();
            return null;
        }

    }
    catch (Exception)
    {
        StatusCode(500, "Internal server error");
        return null;
    }
}

Client side:

public uploadjsonresponse(file, apiname, filename, end, appcomponent, secondapiname) {

    let headers = new HttpHeaders({
      'Content-Type': 'application/json',
      'Access-Control-Allow-Origin': '*',
    });

    return this.httpClient.post(this.SERVER_URL + apiname, file, {headers: headers}).pipe(map(res => 
  {

      appcomponent.filemapper.push(filename + ";;;" + res);
      console.log(appcomponent.filemapper[appcomponent.filemapper.length-1]);
      if (end) // callback
        appcomponent.requestmapping(secondapiname, end, this);
    }));  
  }

The problem is that "res" comes back null client side. Yet, it is being correctly returned by the server (return id). Any ideas as to why that might be?

Barremian · Accepted Answer · 2020-07-30 08:05:38Z

1

When you enclose an arrow functions in curly braces, the return keyword should be stated explicitly. So you could append return to the statement that you wish to return from the map.

Try the following

return this.httpClient.post(this.SERVER_URL + apiname, file, { headers: headers }).pipe(map(res => {
  let result = '';     // <-- change it to your desired value
  
  appcomponent.filemapper.push(filename + ";;;" + res);
  console.log(appcomponent.filemapper[appcomponent.filemapper.length - 1]);
  if (end) {       // callback
    result = appcomponent.requestmapping(secondapiname, end, this);
  }

  return result;        // <-- return result here
}));

When it comes to arrow functions

const convert = (value) => /* convert and return */;

is the same as

const convert = (value) => { return /* convert */ };

answered Jul 30, 2020 at 8:05

Barremian

31.2k4 gold badges37 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Diveye Over a year ago

Thanks for the tip! That's not it unfortunately. The res response returned in the client is null from the start.. though it is correctly sent back. I tried what you suggested but to no avail...

Barremian Over a year ago

@Diveye: How do you confirm that it's correctly sent back?

Diveye Over a year ago

I had a breakpoint on the return statement. All good now! Thanks for the help!

Diveye · Accepted Answer · 2020-07-30 08:27:18Z

0

I am an idiot... Just needed to remove this in the .net API:

Response.Body.Flush(); // http response

Tada. God.

answered Jul 30, 2020 at 8:27

Diveye

2715 silver badges16 bronze badges

Collectives™ on Stack Overflow

Angular POST request response is null (yet server returns correct string)

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related