How to Build a Blog App Using Blazor WASM and Strapi

1

This article has been updated to v4 by Mark Munyaka.

This is a companion discussion topic for the original entry at https://strapi.io/blog/how-to-build-a-blog-app-using-blazor-wasm-and-strapi
2

Great Post! It was really helpful but I found the index.razor code needed a little massaging in order to accept data from Strapi. Unless you want to create an exact model of the get response ie:

{
  "data": [
    {
      "id": 3,
      "youtubeId": "ziAsCStdiPE",
      "title": "Did I overpay for these?",
      "summary": null,
      "content": null
    }
  ], 
"meta": {
    "pagination": {
      "page": 1,
      "pageSize": 25,
      "pageCount": 2,
      "total": 45
    }
  }
}

When trying to convert the JSON object into a custom model in C# it actually chokes due to missing attributes I didn’t want to include in my custom model. So, this how I got around that issue:

strapi_api_url = Configuration["AppSettings:STRAPI_API_URL"];
		var url = "{STRAPI_API_URL}/posts";

		var response = await Http.GetStringAsync(url.Replace("{STRAPI_API_URL}", strapi_api_url));
		IList<Post> parsedPosts = new List<Post>();
		if (response != null)
		{
			JObject keyValuePairs = JObject.Parse(response);
			// get JSON result objects into a list
			IList<JToken> results = keyValuePairs["data"].Children().ToList();

			
			foreach (JToken result in results)
			{
				// JToken.ToObject is a helper method that uses JsonSerializer internally
				Post post = result.ToObject<Post>();
				parsedPosts.Add(post);
			}
		}
		else
		{
			throw new Exception("Failed to get data");
		}
		

		if (parsedPosts.Count() > 0)
		{
			allPosts = parsedPosts;
		}

From there everything worked as expected. Hopefully this helps someone in the future.

4

Has this been fixed? I followed the tutorial and utilized a supposed fix found on GitHub to no avail. right now the code still seems to be a dead end.