シングルページアプリケーションの配信

コード例: single-page-application

Ktorは、React、Angular、Vueなどのシングルページアプリケーションを配信する機能を提供します。

依存関係の追加

シングルページアプリケーションを配信するには、ktor-server-core の依存関係のみが必要です。 特定の依存関係は必要ありません。

アプリケーションの配信

シングルページアプリケーションを配信するには、コンテンツをどこから配信するか（ローカルファイルシステムまたはクラスパス）を定義する必要があります。 少なくとも、シングルページアプリケーションが含まれているフォルダーまたはリソースパッケージを指定する必要があります。

フレームワーク固有のアプリケーションの配信

React、Angular、Vueなどの特定のフレームワークを使用して作成されたシングルページアプリケーションのビルドを配信できます。 プロジェクトのルートに、Reactアプリケーションを含む react-app フォルダーがあるとします。 このアプリケーションは以下の構造を持ち、index.html ファイルがメインページとなります:

react-app
├── index.html
├── ...
└── static
    └── ...

このアプリケーションを配信するには、routing ブロック内で singlePageApplication を呼び出し、react 関数にフォルダー名を渡します:

import io.ktor.server.application.*
import io.ktor.server.http.content.*
import io.ktor.server.routing.*

fun Application.module() {
    routing {
        singlePageApplication {
            react("react-app")
        }
    }
}

Ktorは自動的に index.html を検索します。 デフォルトページをカスタマイズする方法については、配信設定のカスタマイズを参照してください。

他のフレームワークについては、angular、vue、ember などの対応する関数を使用してください。

配信設定のカスタマイズ

リソースからシングルページアプリケーションを配信する方法を示すために、アプリケーションが以下の構造を持つ sample-web-app リソースパッケージ内に配置されていると仮定します:

sample-web-app
├── main.html
├── ktor_logo.png
├── css
│   └──styles.css
└── js
    └── script.js

このアプリケーションを配信するには、以下の構成を使用します:

import io.ktor.server.application.*
import io.ktor.server.http.content.*
import io.ktor.server.routing.*

fun Application.module() {
    routing {
        singlePageApplication {
            useResources = true
            filesPath = "sample-web-app"
            defaultPage = "main.html"
            ignoreFiles { it.endsWith(".txt") }
        }
    }
}

• useResources: リソースパッケージからのアプリケーション配信を有効にします。
• filesPath: アプリケーションが配置されているパスを指定します。
• defaultPage: 配信するデフォルトのリソースとして main.html を指定します。
• ignoreFiles: 末尾が .txt で終わるパスを無視します。

完全な例はこちらにあります: single-page-application