Populate all nested components in API response

System Information
  • Strapi Version: 4

I have pages with two dynamic zones named mainBlock & sideBlock.
Each page is unique and any component can be in any dynamic zone.
for example, consider this api response

here i need to populate the fields which i can do using manual queries but other pages can have
different components such as gallery etc…
its not possible for me to write manual queries for each and every page as it is highly dynamic.
i want the strapi to send a complete api response with all nested components/fields fully populated.


I found this feature is not available yet and the other solutions are touching strapi files which i don’t want to do that yet since strapi is evolving fast.

I made a workaround by

  1. adding a field name devurl (example: populate[mainBlock][populate][links_group][populate][linksGroup][populate]=&populate[sideBlock][populate][links_group][populate][linksGroup][populate]=) in page collection. this field changes based on the content type of the page.
  2. and then in frontend , i have to make two requests. one to get the devurl (minimal/default response)
    and another request which actually contain all data of the respective page.
const response = await axios.get(
      "http://localhost:1337/api/pages?filters[url][$eq]=" + slug

    data = response.data.data[0];
    const url =
      "http://localhost:1337/api/pages/" +
      data.id +
      "?" +
    if (data.attributes.devurl && data.id) {
      const devResponse = await axios.get(url);

      devData = devResponse.data.data;
    } else {
      //throw error

am making two requests and i had to type custom populated attributes for each pages. i also need to update this devurl field everytime the structure of the page changes as well.

I found this really useful plugin

1 Like