Cloudflareでのサブディレクトリ設定

Cloudflareを使って/docsサブディレクトリでドキュメントをホストする

1

GitBookサイトの設定

GitBook の組織で、サイドバーのドキュメントサイト名をクリックし、次に サイトを管理 をクリックするか、 設定 タブを開きます。 ドメインとリダイレクト セクションを開き、「Subdirectory（サブディレクトリ）」の下で サブディレクトリを設定.

ドキュメントをホストしたいURLを入力します。次にドキュメントアクセス用のサブディレクトリを指定します。例： tomatopy.pizza/docs、そしてクリックします 設定.

の下に 追加の設定、プロキシのURLが表示されます。Cloudflareワーカーを設定する次のステップでこれを使用します。クリップボードにコピーしてください。

2

Cloudflareワーカーを作成する

Cloudflareアカウントにサインインして、次のページに移動します Workers & Pages

をクリックします 作成 ボタン。

「アプリケーションを作成」画面で、 Hello world カードの「テンプレートから開始」ボタンをクリックします。

ワーカーに、次のようなより説明的な名前を付けます： mydocs-subpath-proxy。名前の変更が終わったら、クリックします /docs.

3

カスタムドメインを構成する

ワーカーには使用できるデフォルトのURLが付与されます。代わりに（例えば tomatopy.pizzaのような）カスタムドメインを構成するには、クリックします 設定。 次に、「ドメインとルート」セクションで、クリックします + 追加.

開いた「ドメインとルート」トレイで、クリックします カスタムドメイン、次に続くテキストボックスにカスタムドメインを入力します。カスタムドメインを指定する際は、 含めないでください サブディレクトリを。例えば、 tomatopy.pizza は正しく、対して tomatopy.pizza/docs は正しくありません。

4

ワーカーコードを更新する

ワーカーのデプロイが完了したら、クリックします コードを編集、またはクリックします プロジェクトに進む、そして右上の コードを編集 ボタンをクリックします。

開いたコードエディタで、サンプルコードを次のスニペットに置き換えます：

export default {
  fetch(request) { 
    const SUBDIRECTORY = '/docs';
    const url = new URL(request.url);
    const target = "<INSERT YOUR PROXY URL FROM GITBOOK>" + url.pathname.slice(SUBDIRECTORY.length);
    const proxy = new URL(
      target.endsWith('/') ? target.slice(0, -1) : target 
    )
    proxy.search = url.search;
    return fetch(new Request(proxy, request));
  }
};

5行目のURLを、最初のステップでGitBookから取得したプロキシURLに必ず更新してください。

それが完了したら、クリックします /docs。このプロセスには数分かかる場合があります。完了したら、そのURLにアクセスすると、ドキュメントサイトが表示されるはずです！