5

私は基本的な React/Flux アプリケーションを構築しており、ルーティングには react-router-component を使用し、ビルド変更時のライブ リロードには browser-sync を使用し、依存性注入には browserify を使用しています。

私が抱えている問題は、ライブ リロードまたはリロードがそうでないパス/(つまり/profile、/gallery、など) で発生すると、GET できません/path(またはそのための任意のルート) というエラー メッセージが表示されることです。

これは、単一ページのアプリケーションであり、すべてのルーティングがクライアントで行われるという事実と関係があると思われます。

これが私のブラウザ同期設定です（非常に基本的なものです）。ミドルウェアを追加する必要があるかもしれないと思いますが、実際にミドルウェアに何を入れればよいかわかりません。

gulp.task('browser-sync', function() {
    browserSync({
        server: {
            baseDir: './client'
        },
        notify: false
    });
});
4

2 に答える 2

9

これは、アプリを提供するために使用している Web サーバーがサーバー側で /profile または /gallery を実際に見つけようとしていることが原因である可能性があります。代わりに、すべてのリクエストがルートに送られるようにサーバーに指示する必要があります。ソフトウェアによっては、これを「html 5 モード」と呼ぶことがあります。

browser-sync git repo に、これに関する可能な解決策が記載された投稿があることに気付きました: https://github.com/shakyShane/browser-sync/issues/204

ただし、基本的な考え方は、サーバーが *.js または *.css 以外のすべてのものを ./index.html に送信するようにすることです (これがアプリのエントリポイント ファイルであると仮定します)。そうすれば、サーバーはそれらのルート自体を検索せず、アプリをロードするだけで、クライアント側でそれらを正しく解析できます。

お役に立てれば。

于 2014-09-13T00:20:45.593 に答える