Backbone.history is already running

Question

I get the error "Backbone.history is already running" in my Backbone.js application. Here is my code.

(function ($) { // model for each article var Article = Backbone.Model.extend({}); // collection for articles var ArticleCollection = Backbone.Collection.extend({ model: Article }); // view for index page var MainView = Backbone.View.extend({ el: $('#wrapper'), render: function (){ var template = Handlebars.compile($("#main_hb").html()); $(this.el).find('#main_content').html(template); return this; } }); // view for listing blog articles var ArticleListView = Backbone.View.extend({ el: $('#wrapper'), render: function(){ var js = this.model.toJSON(); var template = Handlebars.compile($("#articles_hb").html()); $(this.el).find('#main_content').html(template({articles: js})); return this; } }); // main app var ArticleApp = Backbone.Router.extend({ // setup routes routes: { "" : "index", "blog" : "blog" }, index: function(){ var main = new MainView({}); main.render(); return this; }, blog: function(){ $.ajax({ url: 'blogs/articles', dataType: 'json', data: {}, success: function(data) { var articles = new ArticleCollection(data); var view = new ArticleListView({model: articles}); view.render(); } }); return this; } }); // let start the app! articleApp = new ArticleApp(); Backbone.history.start(); })(jQuery); 

It looks like the application is working fine. But this error in Chrome is mysterious.

Answer 1

12/30/2013 UPDATE: it looks like this could be a common problem, I decided to boldly explain the reason.

I ran into the same problem and solved it. The reason is that I

imported the js file twice

Therefore, I can suggest that you check the page containing this script to see if it has been entered twice.

Answer 2

The Yuigings said it right! He imported js twice. updated My “fix” (specifically, a more workaround) was to put it on the router.

 Backbone.history.stop(); Backbone.history.start(); 

Probably not the most ideal, but he did his work in a naive way.

Answer 3

I had the same issue due to Turbolinks in my Rails 4 application. This workaround helped me. Perhaps this will also help:

 initialize: -> new MyApp.Routers.Posts Backbone.history.start() unless Backbone.History.started $(document).on "page:change", -> Backbone.history.stop() Backbone.history.start() 

Found this answer here: https://github.com/codebrew/backbone-rails/issues/134

Answer 4

Your code looks fine. Are you sure you download it exactly once? If you put console.log () immediately before history.start (), does the log print exactly once?

In general, you get this error when history.start () is called multiple times. I'm afraid you need to find the second call. The code you posted here is not enough to find it.

Answer 5

I ran into this problem, and precisely because I was doing require_tree. in my application.js file, and I precompiled my resources.

Make sure you do not have a public / assets file if you intend to use require_tree. in the application .js . > file.

Answer 6

If you use requirejs, make sure your script does not include itself - just add console.error () to the beginning and see how many times it appears. I got this because I copied the optimization configuration to linear execution.

Answer 7

Try the following:

  articleApp = new ArticleApp(); Backbone.history = Backbone.history || new Backbone.History({}); Backbone.history.start();