NextJS and Strapi : fetch multiple API pages using one getStaticPaths() function

user_14806798 0
Viewed 751

NextJs and Strapi both explain how to pull data from a single collection type inside Strapi by doing this:

const pages = await (await fetch(getStrapiURL("/pages"))).json();
 const paths = pages.map((page) => {
    // Decompose the slug that was saved in Strapi
    const slugArray = page.slug.split("__");
    return {
      params: { slug: slugArray },
    };
  });
  return { paths, fallback: true };

}

Now my goal is to pull data from multiple collection types / pages: Here is my current code that I am using to do this:

export async function getStaticPaths() {
  const [ pages, blogs ] = await Promise.all([
    fetchAPI("/pages"),
    fetchAPI("/blogs"),
  ]);
}

As you can see I have used a promise function to fetch multiple at the same time.
How do I map both these pages together in a map function

strapi next.js reactjs javascript
1 Answers

Edits: I was complicating by using like this:

export async function getStaticPaths() {
  const [pages, blogs] = await Promise.all([
    fetchAPI("/pages"),
    fetchAPI("/blogs"),
  ]);
  const all = {pages, blogs}
  const paths = Object.keys(all).map(a => ({params: all[a]}))
  return {
    paths,
    fallback: true
  }
}

But while you can simply use like this:

export async function getStaticPaths() {
  const all = await Promise.all([
    fetchAPI("/pages"),
    fetchAPI("/blogs"),
  ]);
  const paths = all.map(a => ({params: a}))
  return {
    paths,
    fallback: true
  }
}
user_21387520
Related