1

I have an ASP.NET Core app project, SQL Server in the backend and React as the frontend.

When I pass the parameters (must be 1 or 0) to SetGameResults method through Swagger UI (browser) the database accepts the parameters and the table is filled.

But when I pass the parameters through the React client-side to ASP.NET, I get this error:

Inner Exception: Procedure or function 'Set_Game_Result' expects parameter '@user1_res', which was not supplied.

Swagger browser

Controller.cs:

[HttpPost]
[Route("SetGameResults")]
public string SetGameResults(byte? user1, byte? user2)
{
    if (!(user1 >= 1 && user2 >= 1))  // it passes this condition - 
    {
        DataTable table = new DataTable();
        string sqlDataSource = _configuration.GetConnectionString("tictaktoedb1");
        SqlDataReader myReader;

        try
        {
            using (SqlConnection myCon = new SqlConnection(sqlDataSource))
            {
                myCon.Open();

                using (SqlCommand myCommand = new SqlCommand("Set_Game_Result", myCon))
                {
                    myCommand.CommandType = CommandType.StoredProcedure;
                    myCommand.Parameters.AddWithValue("@user1_res", user1);
                    myCommand.Parameters.AddWithValue("@user2_res", user2);

                    myReader = myCommand.ExecuteReader();

                    table.Load(myReader);
                    myReader.Close();

                    if (table.Rows.Count > 0)
                    {
                        var JsonResoltString = JsonConvert.SerializeObject(table);

                        return JsonResoltString;
                    }

                    return "No data sent and table returned empty";
                }
            }
        }
        catch (SqlException ex)
        {
            return "Inner Exception: " + ex.Message;
        }
        catch (Exception ex)
        {
            return $"Outer Exception: " + ex.Message;
        }
    }

    return "No data sent";
}

React Native

  let data= {
    us1: gameResult.us1Win,
    us2: gameResult.us2Win,
  };
 const fetchResponse = await fetch(URL, {
  body: JSON.stringify(data),
  method: 'POST',
  headers: {
    Accept: 'application/json',
    'Content-type': 'application/json; charset=UTF-8',
  },
});
const data = await fetchResponse.json();

Be glad for some explanations about that, thanks.

Elassoa
  • 133
  • 2
  • 18
  • 1
    1) How do you pass this parameter in Swagger UI? E.g. is it passed in the URL query string or request body? 2) Please post your React code where you're passing this parameter. 3) Also post the full HTTP request details from the browser's Network tab. – Helen Oct 04 '22 at 14:18
  • In Swagger UI, `user1` and `user2` are URL query parameters for a GET(?) request, but your React code seems to be passing them in the POST request body instead. Try changing the request method to GET and adding those parameters to the URL query string. – Helen Oct 04 '22 at 16:11
  • @Helen how come they are for GET method ? how do you see that? – Elassoa Oct 04 '22 at 16:14
  • 1
    Apologies, it's POST method in Swagger UI too (based on the colors of GET/POST as seen on https://petstore.swagger.io - GET is blue, POST is green). But the params do need to be passed in the query string. – Helen Oct 04 '22 at 16:17
  • @Helen I updated my `js` example, how can I pass them in a query string? In many other projects i did I passed the parameters as I did here so I didn't have this problem – Elassoa Oct 04 '22 at 16:45
  • See [Setting query string using Fetch request](https://stackoverflow.com/q/35038857/113116). (That Q&A is originally about GET, but the same approach applies to POST query strings.) – Helen Oct 04 '22 at 17:39

0 Answers0