【Nextjs】microCMSからデータを取得できない

はじめに

NextjsとmicroCMSを用いてブログサイトを作っていたところ、データ取得に躓いたのでまとめます。

問題

以下のエラーが出ました。

 × Error: Network Error.
  Details: fetch failed

おそらく、microCMSのクライアント作成時に問題が発生していると考えられます。

解決策

serviceDomainを変更する

client.ts

import { createClient } from "microcms-js-sdk";

export const client = createClient({
  - //serviceDomain: "https://my-tech-blog-jisou",
  serviceDomain "my-tech-blog-jisou",
  apiKey: process.env.MICROCMS_API_KEY,
});

" https:// "の部分がいらなかったようです。

おわりに

今回はmicroCMSのドキュメントを見たのですが、" https:// "が必要ないという旨を見つけることができず、chatgptに聞いて解決しました。

About Me

• X(Twitter)