Nuxt.js + Firestore で動的サイトマップ

令和元年記念で5月1日にアップする予定でしたが、GW10連休長過ぎ問題（ほぼ子供のお世話してた）で中断し遅れに遅れたのでとりあえず投稿してしまいます。
この例はブログ記事を想定してます。（動的サイトマップ部分はブログ記事。Firestore の DB　は articles）

Install

• nuxt (v2.6.3)
• firebase (v5.10.1)
• @nuxtjs/sitemap (v1.0.0)

nuxt.config.js

（コード一部抜粋）

const axios = require('axios')

const API_URL = `https://firestore.googleapis.com/v1/projects/YOUR_PROJECT_ID/databases/(default)/documents/`

function convertObjToSitemapDataArr ({ obj, path, changefreq }) {
  const arr = []
  obj.data.documents.forEach((doc) => {
    const id = doc.name.match(/(\/.+\/)(.+?)$/)[2]
      arr.push({
        url: `${path}/${id}`,
        changefreq: changefreq,
        priority: 1,
        lastmod: new Date(doc.updateTime)
      })
  })
  return arr
}

module.exports = {
  // ...
  modules: [
    '@nuxtjs/sitemap'
  ],
  sitemap: {
    path: '/sitemap.xml',
    hostname: 'https://example.com',
    cacheTime: 1000 * 60 * 60 * 24, // 24 hours
    gzip: true,
    generate: true,
    exclude: [
      '/404',
      '/accounts/**',
      '/articles/new',
    ],
    routes (callback) {
      return Promise.all([
        axios.get(`${API_URL}articles`),
        axios.get(`${API_URL}users`)
      ]).then(([articles, users]) => {
        callback(
          null,
          [
            convertObjToSitemapDataArr({ obj: articles, path: 'articles'}),
            convertObjToSitemapDataArr({ obj: users, path: 'users', changefreq: 'monthly'})
          ].reduce((accumulator, currentValue) => accumulator.concat(currentValue), [])
        )
      })
    }
  }
}

api の取得データ例

$ curl https://firestore.googleapis.com/v1/projects/${projectId}/databases/(default)/documents/articles
{
  "documents": [
    {
      "name": "projects/YOUR_PROJECT_ID/databases/(default)/documents/articles/xxxxxxxxxxxxx",
      "fields": {
        "title": {
          "stringValue": "article_name01"
        },
        "body": {
          "stringValue": "It is very fine today."
        },
        "tags": {
          "arrayValue": {
            "values": [
              {
                "stringValue": "tag01"
              }
            ]
          }
        },
        "rating": {
          "integerValue": "5"
        }
      },
      "createTime": "2019-04-29T03:09:28.011455Z",
      "updateTime": "2019-04-30T05:55:08.013727Z"
    }
  ]
}

サイトマップにアクセス

/sitemap.xml にアクセスすると表示されるはず。

大体こんな感じ

参考リンク

https://firebase.google.com/docs/firestore/use-rest-api?hl=ja
https://github.com/nuxt-community/sitemap-module#readme
https://qiita.com/sauzar18/items/2ea958043eb6758c4f83
https://qiita.com/bucchi49/items/d271c4010a3f6c900926