CODEWITHSUNDEEP
javascriptbackbone.js
Omid Kamangar
Omid Kamangar

Reputation: 5778

Backbone.js pushState is not working and gives a 404 error

I have been watching the screencast from PeepCode on Backbone.js, and have done the coding with it.

I have finished the first part and now, I have a Router like this:

routes: {
    '': 'home',
    'blank': 'blank'
}

and also I have this to start the App:

$(function(){
    window.App = new BackboneTunes();
    Backbone.history.start({pushState: true});
});

Now, if I type http://localhost:9292/#blank in the URL bar, it redirects me to http://localhost:9292/blank, but if I type http://localhost:9292/blank directly, it gives a 404 message.

Is this normal or do I have an error here?

Thanks in advance.

Upvotes: 2

Views: 2046

Answers (2)

Alamgir Mand
Alamgir Mand

Reputation: 319

For those that thought the above answer was insufficient: What you want to do is enable your server to reroute all urls to your index.html page where Backbone.js will take care of the routing for you. The following steps will let you do this while still keeping the URL the same inside the address bar.

If you're using Apache as your container, you need to enable a mod_rewrite module inside your application's .htaccess file.

Inside your httpd file:

1) Make sure that your "Override" command for your document root is enabled to "Override All" instead of "Override None"

2) Enable the mod_rewrite.so module by uncommenting this line:

LoadModule rewrite_module modules/mod_rewrite.so

Inside your application's .htaccess file (if you don't have one, create one):

1) If you have a IfModule mod_rewrite.c module already written, then copy these lines into one of the modules:

RewriteEngine On
RewriteRule ^/[a-zA-Z0-9]+[/]?$ /index.html [QSA,L]

You should have something that looks like this:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteRule ^/[a-zA-Z0-9]+[/]?$ /index.html [QSA,L]
</IfModule>

Edit

Note: In Apache 2.2+, you can now use FallbackResource instead of mod_rewrite, it requires fewer lines and accomplishes the same thing.

Upvotes: 8

Jim Puls
Jim Puls

Reputation: 81062

You need to set up your server to return the same page for all of the URLs that Backbone routes to. Right now, it's only serving the page from the root URL.

Upvotes: 3

Related Questions