Error using LiveReload on virtual machine with grunt

Question

I am working with a virtualbox set up with vagrant/puphpet (ubuntu 12.04). I set up grunt and contrib-watch successfully. I installed the chrome extension ... everything as specified here : https://github.com/gruntjs/grunt-contrib-watch#live-reloading

My Gruntfile is as follow :

module.exports = function(grunt)
{

require('load-grunt-tasks')(grunt);

grunt.initConfig({
  compass: {                  // Task
    dist: {                   // Target
      options: {              // Target options
        sassDir:        'sass',
        cssDir:         'css',
        environment:    'development',
        httpPath:       '/',
        imagesDir:      'img',
        relativeAssets:  true
      }
    }
  },
watch: {
    options: { livereload: true },
    sass: {
        files: ['sass/**/*.scss'],
        tasks: ['compass'],
        options: { spawn: false }
    }
}
});

grunt.registerTask('default', ['compass']);
}

I run command "grunt watch" and it processes my sass right. But in Chrome's console I get the following error :

GET http://127.0.0.1:35729/livereload.js?ext=Chrome&extver=2.0.9
net::ERR_CONNECTION_REFUSED  injected.js:116

If I add the script manualy in my view I still get the error :

GET http://localhost:35729/livereload.js net::ERR_CONNECTION_REFUSED 

Any idea where this error could come from and why it's not loading the script ?

Answer 1

Your gruntfile looks alright.

It looks like your virtual machine refuses the connection. Make sure the live reload port is open in iptables.

In Ubuntu, that can be done simply with ufw:

sudo apt-get install ufw
sudo ufw enable
sudo ufw allow 35729/tcp