带有流浪环境的 gulp-livereload：livereload.js 无法访问答案

【问题标题】：gulp-livereload with vagrant environment : livereload.js not accessible带有流浪环境的 gulp-livereload：livereload.js 无法访问
【发布时间】：2014-11-19 11:10:14
【问题描述】：

我在我的 vagrant 环境（使用 puphpet 生成）中使用 gulp-livereload 时遇到问题。我的电脑是 Windows 主机，VM 是 Debian。

我使用这个 gulpfile ：

var gulp       = require('gulp'),
    less       = require('gulp-less')
    lr         = require('tiny-lr'),
    livereload = require('gulp-livereload'),
    server     = lr()
;

gulp.task('less', function () {
    gulp.src('assets/less/*.less')
        .pipe(less())
        .pipe(gulp.dest('build/css'))
        .pipe(livereload(server))
    ;
});

gulp.task('watch', function() {
    gulp.watch('assets/less/*.less', ['less']);
    livereload.listen(35729, function(err){
        if(err) return console.log(err);
    });
});

gulp.task('default', ['watch', 'less']);

当 Chrome 扩展程序添加魔术 JS 文件时，我收到此消息：

加载资源失败：net::ERR_CONNECTION_TIMED_OUT http://markup.dev:35729/livereload.js?ext=Chrome&extver=0.0.5

但在我的虚拟机中，如果我运行以下命令行，我会得到它

wget http://localhost:35729/livereload.js?ext=Chrome&extver=0.0.5

【问题讨论】：

您知道代码中的“lr”、“livereload”和“server”变量是全局变量吗？
是的，我知道，但我认为这不是问题
是的……虽然使用全局变量不好且不可预测，但我同意。这就是我没有发布答案的原因。
从哪里得到markup.dev？
markup.dev 在我的主机文件中定义，并由虚拟机托管

标签： javascript vagrant puphpet gulp-livereload

【解决方案1】：

我没有足够的信息来确定，但我猜你的问题是你试图从主机访问页面，但是 livereload 端口没有被转发（VM 有它自己的 IP 地址和vagrant 可以配置为将某些端口转发到主机，以便它们“看起来”是主机上的本地端口）。

尝试将以下行添加到您的Vagrantfile：

config.vm.network "forwarded_port", guest: 35729, host: 35729

（有关文档，请参阅：https://docs.vagrantup.com/v2/networking/forwarded_ports.html）

或者，如果您直接访问虚拟机（即您将 markup.dev 映射到来宾的 IP），则可能值得验证您的虚拟机上没有配置防火墙，这可能会阻止 livereload 端口从外部访问。

【讨论】：

嗨，markup.dev 在我的主机文件中定义，并由虚拟机托管。当我在浏览器中打开 markup.dev 时，它正在工作，没有针对端口 80 的特定配置我尝试了您的解决方案，但这并不能解决我的问题:(
在添加上面的行后，您是否重新加载了您的 vagrant 配置？因为这听起来确实像是一个网络问题。

【解决方案2】：

在我的例子中，端口转发是自动工作的。但是，我必须将 VM 的 IP 指定为主机：

livereload.listen({
    host: '192.168.33.10'
});

更新：传递null 也可以：

livereload.listen({
    host: null
});

我猜想底层的http server 在传递'localhost' explicitly 时表现不同。

【讨论】：