API with localhost

2 min read
Last update: November 28, 2021

Flutter cannot communication directly with a Vhost, the app need a online API, like and NOT http://laravel-app.localhost (a supposed Vhost with NGINX or Apache2 for example). To communicate with localhost API, you need to use tunnelling service like ngrok or expose.

Easy way

You can use to replace locahost, just like that. Here you have an example with Laravel localhost

String _api = ''
// Instead of 'http://localhost:8000/api'


To use API with Flutter app, you can't directly use localhost VHost, it's necessary to use ngrok (you need to create free account to get auth token).

1 - Install ngrok

ngrok on Linux :

scoop install ngrok

Save token just once after install (to have it, you need to create an account and check your dashboard :

ngrok authtoken random_token

2 - Execute serve on your back-end application

Example for a Laravel application

php artisan serve

To get default

The application is available on port 8000

3 - And, in another tab, execute ngrok

If the application is available on port 8000, execute below command (change port if it's necessary)

ngrok http 8000

4 - You will have output like

Forwarding           -> http://localhost:8000


Official documentation:

Install expose globaly with composer

composer global require beyondcode/expose

Set token (to have this, create an account on

expose token xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx

Expose your Vhost, here laravel-app.localhost is the hypothetical Vhost

expose share laravel-app.localhost

You will have this output

Local-URL:              laravel-app.localhost

And you can connect your app to