Sitemapの作成例

動的ページsitemapを作成するコードの例

import axios from "axios";
import fs from "fs";
import prettier from "prettier";

const getDate = new Date().toISOString();
const DOMAIN = "https://www.abcd.com";

const formatted = (sitemap) => prettier.format(sitemap, { parser: "html" });

(async () => {
  // 데이터를 불러오면 전체 product 수를 알려주기 때문에 먼저 500개씩 불러올 page를 만든다.
  let page = 0;

  await axios.get(`~~~~~`).then((res) => {
    page = Math.ceil(res.data.count / 500);
  });

  let response = [];
// page 만큼 반복문을 실행시켜 총 프로덕트를 담은 배열을 만들어준다.
// 반복문을 실행 시키는 이유는 한번에 많은 데이터를 불러오면 time out 에러가 생기기 때문에 500개 정도씩 끊어서 불러줌.
  for (let i = 1; i <= page; i++) {
    await axios
      .get(
        `~~~~~~/?page=${i}&page_size=500`
      )
      .then((res) => {
        response.push(res.data.results);
      })
      .catch((e) => {
        console.log(e.response);
      });
  }

  const productList = [];
  // 마찬가지로 페이지만큼 반복해서 적절히 파싱
  for (let i = 0; i < page; i++) {
    response[i].forEach((product) => productList.push({ slug: product.slug }));
  }

  // 요것도 xml 구조에 맞게 파싱하여 재조립
  const productListSitemap = `
    ${productList
      .map((product) => {
        return `
          <url>
            <loc>${`${DOMAIN}/shop/product/${product.slug}`}</loc>
            <lastmod>${getDate}</lastmod>
          </url>`;
      })
      .join("")}
  `;

  const generatedSitemap = `
    <?xml version="1.0" encoding="UTF-8"?>
      <urlset
      xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
    >
      ${productListSitemap}
    </urlset>
  `;

  const formattedSitemap = formatted(generatedSitemap);

  fs.writeFileSync(
    "../public/sitemap/sitemap-products.xml",
    formattedSitemap,
    "utf8"
  );
})();