8

を実装しようとして{ pushState : true }いますが、ベースルートでのみ機能し、エラー404が引き続き発生する他のルートでは機能しません。

Chrome でアクセスすると:

http://example.app/ - OK コンソール メッセージが表示されます

http://example.app/show - エラー 404 が返される

私のルートは

    var AppRouter = Backbone.Router.extend({

    routes: {
        '': 'index',
            'show': 'show'
        },

        index: function() {
            console.log('This is the index page');
        },
        show: function() {
            console.log('This is the show page');
        }

    });

    new AppRouter;
    Backbone.history.start({pushState: true});

私の.htaccess

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !index
   RewriteRule (.*) index.html [L]
</ifModule>

私は何が欠けているか、間違っていますか？

4

3 に答える 3

15

Backbone はクライアント側のフレームワークであることを思い出してください。ルーティング (プッシュ状態) にパスベースの URL を使用している場合でも、サーバーがそれらの URL に対して正しいマークアップを返すことを確認する必要があります。これは、バックボーンのドキュメントで次のように要約されています。

実際の URL を使用するには、Web サーバーがそれらのページを正しくレンダリングできる必要があるため、バックエンドの変更も必要になることに注意してください。たとえば、/documents/100 のルートがある場合、ブラウザーがその URL に直接アクセスした場合、Web サーバーはそのページを提供できる必要があります。検索エンジンが完全にクロールできるようにするには、サーバーにページの完全な HTML を生成させるのが最善ですが、それが Web アプリケーションの場合は、ルート URL と同じコンテンツをレンダリングし、残りを Backbone で埋めます。ビューと JavaScript は正常に動作します。

つまり、サーバーが理解できない場合、Backbone は役に立ちませんexample.app/show。URL の書き換えやサーバー側の選択した言語を使用して、サーバーを修正する必要があります。

于 2013-03-11T22:15:25.040 に答える
0

その場合の初期化関数を作成する必要があります。

スクリプトの最後でルーターを初期化する前に、これを含めるだけです。

var initialize = function() {

    var app_router = new AppRouter;

    Backbone.history.start({ pushState: false });

    $(document).on('click', 'a:not([data-bypass])', function(e){

        var href = $(this).prop('href');
        var root = location.protocol + '//' + location.host + '/';

        if (root === href.slice(0, root.length)){
            e.preventDefault();
            Backbone.history.navigate(href.slice(root.length), true);
        }
    });

};
于 2013-09-09T13:11:52.140 に答える
-2

URL に「#」が含まれていない可能性があります。私は今、いくつかのチュートリアルに従っていましたが、サーバーへのリクエストの送信を停止する方法に気づきました。

したがって、http://example.app/show の代わりに
http://example.app/#/show
を使用します
。

バックボーンはそれをキャッチできるはずです。

于 2013-09-24T12:21:21.770 に答える