Remix と Cloudflare Workers で Craft CMS の検索ページを作成する

先日の続き。

Cloudflare Workers はあまり関係ないが、 /search?q=hogehoge で検索できるようにしてみる。

詳細ページを作るのとそこまで変わらない。

app/routes/search.jsx を用意する。

export const loader = async ({request}) => {
  const url = new URL(request.url);
  const search = url.searchParams.get("q");
  let res = await fetch(`https://example.com/hogeapi`, {
〜〜〜〜
        }`,
      variables: {
        search: search,
      },
    }),
  })
  return res.json()
}

request に渡ってくる url を元に、searchParams.get("q") でパラメータを取り出す。

クエリ部分は

query($search : String) {
          entries(limit:100,siteId:1,search:$search){

こんなかんじで search に検索用キーワードを渡せば検索できる。