目次

react-notion-xのSearchが405エラーを返す

notion-rendererのSearchが405エラーを返す問題の代替案について解説します。

June 10, 20232 min read
React
Notion

以前個人ブログを Notion を使って書いていたのですが、その際に react-notion-x を使って Notion のページをレンダリングしていました。 このライブラリの中で Search コンポーネントを用いて、記事の検索機能を実装していたのですが突然 405 エラーが返ってくるようになってました。

原因

Notion の API の仕様が変わったことにより、Search コンポーネントが 405 エラーを返すようになったようです。 Search コンポーネント内でリクエストを投げているエンドポイントが https://www.notion.so/api/v3 なのですがここが仕様変更されたのかうまく使えませんでした。

コードブロック

js
//react-notion-xのSearchコンポーネントのコード
constructor({
  apiBaseUrl = 'https://www.notion.so/api/v3', //ここのエンドポイントが調子悪い
  authToken,
  activeUser,
  userTimeZone = 'America/New_York'
})

解決策

治るまでの代替案として、Search コンポーネントを使わずに Notion 公式のSearchAPIを用います。

TypeScript
const response = await axios.post('https://api.notion.com/v1/search', params, {
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${process.env.NOTION_TOKEN}`,
      'Notion-Version': '2022-06-28'
    }
  });
return response.data

ただ、このAPIはタイトルからしか記事をサーチできません。react-notion-xでは記事のデータ(recordMap)まで見て判断していたのでそこは注意です。

See you later👋


0

Conversation