CODEWITHSUNDEEP
phplaravelbrowser-sync
Alan
Alan

Reputation: 2639

Laravel BrowserSync without proxy

I'm trying to use Elixir BrowserSync, one of the newest features of Laravel.

I added it to the gulp file

elixir(function(mix) {
    mix.sass('app.scss')
    .browserSync();
});

when I run "gulp watch" it output this message

[20:49:20] Using gulpfile ~/Desktop/laravel/gulpfile.js
[20:49:20] Starting 'watch'...
[20:49:20] Finished 'watch' after 11 ms
[BS] Proxying: http://homestead.app
[BS] Access URLs:
----------------------------------
Local: http://localhost:3000
External: http://10.9.0.48:3000

Automatically a browser is launched with the url http://localhost:3000 but nothing loads.

I think the problem is related to this line: [BS] Proxying: http://homestead.app

Upvotes: 2

Views: 5479

Answers (4)

Khesayed
Khesayed

Reputation: 362

I found other solution on laracast for Bloomanity and it works with me like a charm! $ php artisan serve --host=0 and then in your gulp add: mix.browserSync({proxy: 'localhost:8000'});

Upvotes: 0

Rich Standbrook
Rich Standbrook

Reputation: 648

You can if you use BrowserSyncs server.

mix.browserSync({
  proxy: false,
  server: {
    baseDir: './'
  }
});

Upvotes: 5

Eivydas Vilčinskas
Eivydas Vilčinskas

Reputation: 116

The direct answer to your question - it is not possible to not proxy the .browserSync. Long side-answer - you can still use elixir's implementation of browserSync in gulp, but you must have a separate PHP server to interpret the files.

Edit: I saw a way to not proxy by providing the script in the pages manually (by not giving any arguments in the .browserSync() call, but don't remember where and how to do it exactly.

The reason is that browserSync requests all the data from the server for you, injects a little javascript listener and displays everything else:

<script type='text/javascript' id="__bs_script__">//<![CDATA[document.write("<script async src='/browser-sync/browser-sync-client.2.9.11.js'><\/script>".replace("HOST", location.hostname));//]]></script>

One way is to php artisan serve --host=0.0.0.0 in a separate terminal to start up the server and then use the .browserSync({proxy: 'localhost:8000'}). It all works - the BrowserSync UI and all the calls to refresh the pages.

Note: I could not connect to artisan serve without the --host=0.0.0.0.

For those wanting an all automated solution via gulp, here it is:

Use the gulp packages gulp-connect-php and laravel-elixir-browsersync2. The first starts up the php artisan serve and the other connects it to browserSync.

  1. Install the packages:

    • npm install laravel-elixir-browsersync2 --save-dev

    • npm install gulp-connect-php --save-dev

  2. Add the required lines to your gulpfile.js:

Code:

var elixir = require('laravel-elixir'),
    gulp = require('gulp');
var connectPHP = require('gulp-connect-php');
var BrowserSync = require('laravel-elixir-browsersync2');

elixir(function(mix) {
    mix.sass('app.scss');
});

elixir(function(mix) {
    connectPHP.server({
        base: './public',
        hostname: '0.0.0.0',
        port: 8000
    });
    BrowserSync.init();
    mix.BrowserSync(
    {
        proxy: 'localhost:8000',
        logPrefix       : "Laravel Eixir BrowserSync",
        logConnections  : false,
        reloadOnRestart : false,
        notify          : false
    });
});
  1. Then - simply gulp.

Disclaimer: This might not work with the gulp watch, but there might be people with the answer to that.

There is also a line PHP server not started. Retrying... before the [Laravel Eixir BrowserSync] Proxying: http://localhost:8000. It belongs to gulp-connect-php when trying to check if the server is running.

Upvotes: 2

Sheldon Kotyk
Sheldon Kotyk

Reputation: 189

Are you running multiple homestead sites? It looks like it defaults to proxying through homestead.app if you do not include a proxy setting. If you don't host your local on homestead.app it won't find it.

Try

.browserSync({ proxy: 'domain.app' });

Where domain.app is what you are serving the site with.

Upvotes: 2

Related Questions