[Vuejs]-Ngrok shows blank page when accessing a laravel project from a remote machine

by

-1👍

To configure ngrok with your Laravel application for local development, follow these steps:

  • Open the AppServiceProvider.php file located in your Laravel project.

  • Add the following code inside the boot method of the AppServiceProvider class:

    public function boot(\Illuminate\Http\Request $request)
{
    if (!empty(env('NGROK_URL')) && $request->server->has('HTTP_X_ORIGINAL_HOST')) {
        $this->app['url']->forceRootUrl(env('NGROK_URL'));
    }

    // Other code
}

  • Open your terminal and run the following command, replacing laravel-site.test with the local URL your Laravel app uses:

    ngrok http -host-header=rewrite laravel-site.test:80

  • ngrok will provide you with a forwarding URL, typically in the format abc123.ngrok.io. Add the following line and replace abc123.ngrok.io with the URL you received from ngrok in the .env file:

    NGROK_URL=https://abc123.ngrok.io

  • Clear your app’s cache using the following commands in the terminal:

    php artisan config:clear
php artisan cache:clear
php artisan view:clear
php artisan route:clear

For more: https://vanrossum.dev/5-using-ngrok-with-laravel

Leave a comment