Unhandled Exception with Flurl Http Call for Strapi

[phmatray]

Bug Report:

Description:

I encountered an issue when making a GET request to a Strapi API using Flurl in a Blazor application. The request triggers a 500 Internal Server Error when calling the API with query parameters. I suspect there may be an issue with how Flurl is handling the query parameters or encoding them incorrectly.

Here is the specs of the endpoints :
https://docs.strapi.io/dev-docs/api/rest/filters-locale-publication#filtering

Here is the exception message:

Unhandled exception rendering component: Call failed with status code 500 (Internal Server Error): GET http://localhost:1337/api/posts?filters=%5Bcategory%5D%5Bslug%5D%5B%24eq%5D%3Ddotnet
Flurl.Http.FlurlHttpException: Call failed with status code 500 (Internal Server Error): GET http://localhost:1337/api/posts?filters=%5Bcategory%5D%5Bslug%5D%5B%24eq%5D%3Ddotnet
   at Flurl.Http.FlurlClient.HandleExceptionAsync(FlurlCall call, Exception ex, CancellationToken token)
   at Flurl.Http.FlurlClient.SendAsync(IFlurlRequest request, HttpCompletionOption completionOption, CancellationToken cancellationToken)
   at Flurl.Http.FlurlClient.SendAsync(IFlurlRequest request, HttpCompletionOption completionOption, CancellationToken cancellationToken)
   at Flurl.Http.ResponseExtensions.ReceiveJson[T](Task`1 response)
   at Strapzor.BlazorApp.Services.ApiClient.GetPostsByCategorySlugAsync(String categorySlug) in /path/to/ApiClient.cs:line 21

Code Snippet:

Here is the method in my Blazor app where the issue occurs:

public async Task<GetManyPostsResponse> GetPostsByCategorySlugAsync(string categorySlug)
{
    // Intended API call: http://localhost:1337/api/posts?filters[category][slug][$eq]=dotnet
    return await ApiUrl
        .AppendPathSegments("api", "posts")
        .SetQueryParams(new { filters = $"[category][slug][$eq]={categorySlug}" })
        .GetJsonAsync<GetManyPostsResponse>();
}

The expected behavior is for this call to return the filtered posts based on the category slug. However, the call results in an internal server error.

Steps to Reproduce:

1. Set up a local Strapi instance with an API endpoint like GET /api/posts that accepts a query parameter to filter by category slug.
2. Create a Blazor app with Flurl and call the API using the above method.
3. Observe the 500 Internal Server Error returned.

Expected Behavior:

The API should return the filtered posts based on the category slug without causing an internal server error.

Actual Behavior:

The API returns a 500 Internal Server Error, and the query parameters seem to be URL-encoded, which may be causing the issue.

Environment:

• Flurl.Http version: 4.0.2
• .NET version: 8.0.403
• Strapi version: 5.0.1
• OS: MacOS Sequoia

Possible Cause or Solution:

It seems the query string is being URL-encoded improperly, especially in how the brackets ([ ]) and the $eq operator are handled. I believe the issue could be with how the query parameters are formatted. It might need to be structured differently when passed to SetQueryParams().

[tmenier]

When you do this:

.SetQueryParams(new { filters = $"[category][slug][$eq]={categorySlug}" })

Flurl will put a "=" between "filters" and everything in that value string. But you say that's not what you want:

?filters[category][slug][$eq]=dotnet

Becase all of this: "[category][slug][$eq]" needs to be on the name side. Flurl's object syntax for SetQueryParams doesn't work so well when the name side contains characters that are not valid in a C# property name, like "[" and "]".

Try this syntax instead:

.SetQueryParam("filters[category][slug][$eq]", categorySlug)