Making a Local Dev Server accessible via Public Domain using Cloudflare Tunnel

Hi all,

Today, we are going to discuss how you can publicly access the local running server with a domain and Cloudflare tunnel.

Pre-requisites

1. Domain
2. DNS on Cloudflare
3. Cloudflare One account access
4. Local server

Set up the environment

Application

Make sure your application runs locally on a port like 8000,9000 etc.

Cloudflare Tunnel

1. Log in to your Cloudflare One account.
2. Go to "Zero Trust".
3. Expand Networks and select Connectors.
4. Click on “Create a tunnel”.
5. Select “Cloudflared”.
6. Give a name to your tunnel.
7. Click on “Save”.
8. In the "Choose your environment" section, select the environment where the server is running.
9. Follow the instructions to install and run a connector.
10. Here, you need to move to your server machine.
11. Open the terminal and perform the instructions to install the "cloudflared" tool.
12. Run using the token (part of the command).
13. Once the installation is completed. Click on Save.

Add IP/CIDR

1. Edit the tunnel to add the IP/CIDR.
2. Choose based on your local DHCP.

Published application routes

1. Click on “Add a published application route”.
2. Give an optional subdomain.
3. Select the domain from the dropdown.
1. You need to have your domain managed by Cloudflare (DNS).
4. An optional path to make sure you have a frontend and a backend that work together.
5. Under service, select Type as HTTP, and your local machine server port.
6. Select the URL of the server application, including the localport.
1. localhost:9000
7. Click on “Save”.

Note: If you have a frontend and a backend, then you need to add one more application route.

In my scenario, the frontend path is * with localhost:9001, and the backend path is api/* with localhost:8000.

Troubleshooted issue

If the frontend with path "/*" is above the backend route, then your backend APIs will never be reached.

So, "move up" the backend with "/api/*" path above the frontend to serve the requests.

Feel free to reach out to me if you have any doubts and clarifications needed at my email psrdotcom@gmail.com