Exposing local server to external device

From what I understand, vite --host should be used to share the server with external devices. I want to connect to the app I'm developing from my phone, and the generated network link does work, but all I see is a default Laravel + Vite template page and not the actual application. (image: https://i.imgur.com/fFOFz6a.png)

What am I misunderstanding? Also I'm currently on Windows and using Laragon, but the result seems to be the same when hosting from my Mac too.

OussamaMater

3 years ago

Level 37

The npm run dev command complies, tracks and update your Frontend modifications without reloading.

In order to share your application in your LAN, you need to run

php artisan serve --host 0.0.0.0

And in your mobile (or any other device in your network), navigate to http://<ip>:8000, where ip is the ip of the computer you are running Laravel in, that should do the trick.

If this helped you, please close the thread by setting a "best answer", for future comers :)

2 likes

Renatas

3 years ago

Level 6

@OussamaMater sorry for late reply. it seems like the routes are working, since it redirects me from "/" to "/home", but the frontend still has problems. Chrome console says

GET http://[::]:5173/@vite/client net::ERR_ADDRESS_INVALID
GET http://[::]:5173/src/main.ts net::ERR_ADDRESS_INVALID

and Firefox gives me a CORS error :( I've tried running Vite with vite --host but nothing changed

VasiliiShvakin

3 years ago

Level 1

@Renatas Perhaps my answer is late, but it will be helpful to someone. For correct url generation, you need to add the hmr.host reference in "vite.config.js", for example:

server: {
    //...your other config
    hmr: {
        host: 'localhost',
    },
},

ruthback

3 years ago

Level 6

In case it helps, the issue with CORS in Firefox may be due to https-only mode enabled, even on localhost.

Please or to participate in this conversation.