Best way to make local dev project accessible on my mobile in local network?
I'd like to test my WASP app on my mobile browser, and I am able to reach the frontend, but naturally it fails when it needs to perform and backend operation. What would be the proper way to configure it in WASP?
3 Replies
Hi @Gus. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
To make your Wasp app accessible on your mobile device in your local network, you'll need to configure both the frontend and backend to be accessible. Here's a step-by-step approach based on the information from the knowledge sources:
1. Frontend Configuration:
By default, Vite (which Wasp uses for the frontend) should provide a network link to access the project locally. However, if you're having trouble accessing it, you might need to adjust your firewall settings or try using a different IP address.
2. Backend Configuration:
The main challenge is usually making the backend accessible. Here's what you can do:
a. Set the server URL:
Configure the
WASP_WEB_CLIENT_URL environment variable to specify the frontend URL as seen by the server. You can do this in your .env file:
Replace <your-local-ip> with your computer's IP address on the local network.
b. Configure the client:
In your .env.client file, set the API URL to point to your local server:
3. Using ngrok (alternative method):
If you're still having trouble, you can use ngrok to expose your local server to the internet. This method was suggested in the Discord conversation:
a. Forward both the client and server:
b. Set the API URL in .env.client:
Replace <ngrok-url-for-3001> with the URL provided by ngrok for port 3001.
4. Testing:
After making these changes, restart your Wasp app and try accessing it from your mobile device using the appropriate URL (either your local IP or the ngrok URL).
For more detailed instructions on testing Wasp apps on a local network, you can refer to the learning materials on GitHub.
Remember to check your firewall settings and ensure that both your computer and mobile device are on the same network. If you continue to face issues, it might be related to network configuration or specific setup on your machine.
Discord support thread Github Issue
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @Gus, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?That worked, thank you sir robot
(that = WASP_WEB_CLIENT_URL + REACT_APP_API_URL setup)
Nice, good bot!
@Gus We're here if you'll need more human help