Nuxt.jsのsitemapにWordPressの記事一覧を含める方法（非同期と再帰を使ってページIDのリストを取得する方法）

モチベーション

フロントエンドはNuxt.jsでWordPressの記事を表示するサイトを作っているときにハマりました。

結論

  sitemap: {
    async routes () {

      const getPostRoutes = async function(page = 1) {
        const fragment = await getPostRoutesFragment(page);
        if (fragment.nextPage) {
          return fragment.data.concat(await getPostRoutes(fragment.nextPage));
        } else {
          return fragment.data;
        }
      };

      const getPostRoutesFragment = (page) => {
        return axios.get(`https://example.com/wp-json/wp/v2/posts?&page=${page}`)
          .then(res => {
            const data = res.data.map(post =>  '/posts/' + post.id);
            return {
              data,
              nextPage: page < Number(res.headers['x-wp-totalpages']) ? page + 1 : 0,
            }
          });
      };

      return await getPostRoutes();
    }
  },

参考にしたサイト

Asynchronous with async … の部分
https://blog.scottlogic.com/2017/09/14/asynchronous-recursion.html