Question

当我咕噜咕噜地为我的应用程序提供服务时，我的骨干路线运行良好，但是当我上传它时，路线都搞砸了。

主页效果很好，但是当我想导航时（例如：http://quentin-morisseau.me/capucime）我登陆404页面。

如果我添加一个＃（例如：http://quentin-morisseau.me/#capucime），我会在没有哈希的情况下重新路由，因为链接应该可以工作，最后得到页面。

然后，如果我重新加载我的页面，我也会得到一个404页面。

我的推送状态也是如此。

这是我的代码：

main.js：

    'use strict';

require.config({
    shim: {
        underscore: {
            exports: '_'
        },
        backbone: {
            deps: [
            'underscore',
            'jquery'
            ],
            exports: 'Backbone'
        }
    },
    paths: {
        jquery: '../bower_components/jquery/jquery',
        backbone: '../bower_components/backbone/backbone',
        underscore: '../bower_components/underscore/underscore',
        text: '../bower_components/requirejs-text/text',
        requirejs: '../bower_components/requirejs/require'
    }
});

define(['my-app', 'jquery'], function(Q, $){
    Q.start();
});

my-app.js：

'use strict';
define(['backbone', 'jquery'], function(Backbone, $){
    var Q = {
        Views: {},
        Models: {},
        Collections: {},
        Router: {},
        Status: {},
        init: function(){
            Q.Router = new (Backbone.Router.extend({
                routes: {
                    '': 'home',
                    'capucime': 'capucime',
                    'lequipe': 'lequipe',
                    'nathaniel': 'nathaniel',
                    'comptoir': 'comptoir'
                },

                initialize: function(){
                    Backbone.history.start({pushState: true, root: '/'});
                },

                home: function(){
                    require(['views/home'], function(View){ 
                        var Home = new View();
                        Home.render();
                    })
                },

                capucime: function(){
                    require(['views/capucime'], function(View){ 
                        var Capucime = new View();
                        Capucime.render();
                    })
                },

                lequipe: function(){
                    require(['views/lequipe'], function(View){ 
                        var Lequipe = new View();
                        Lequipe.render();
                    })
                },

                nathaniel: function(){
                    require(['views/nathaniel'], function(View){ 
                        var Nathaniel = new View();
                        Nathaniel.render();
                    })
                },

                comptoir: function(){
                    require(['views/comptoir'], function(View){ 
                        var Comptoir = new View();
                        Comptoir.render();
                    })
                }
            }));
        },
        start: function(){ Q.init(); }
    };
    return Q;
});

感谢您帮助我弄明白：）

昆汀。

编辑：

找到关于.htaccess的答案，如果有人有同样的问题：

# ----------------------------------------------------------------------
# HTML5 pushstate (history) support:
# ----------------------------------------------------------------------

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

这是一个已知问题，我猜......

谢谢大家，顺便说一句。

Answer 1

您应该将您的Web服务器设置为路由到您的索引页面，无论如何，＆＃34; catch-all＆＃34;路由，从中加载所有的javascript，它将正常工作。

所以，当您点击/capucime时，您应该提供索引页面，例如index.html，让javascript加载正确的页面。

你咕噜咕噜的服务脚本设置了这样的全能路线，但你必须在生产中的网络服务器上配置它，以使你的单页应用/单页面应用程序工作。

骨干路由没有哈希值也不起作用

1 个答案: