💻 [runtimeterror $]

2024-01-15

Publish Services with Cloudflare Tunnel

I've written a bit lately about how handy Tailscale Serve and Funnel [1] can be, and I continue to get a lot of great use out of those features. But not *every* networking nail is best handled with a Tailscale-shaped hammer. Funnel has two limitations that might make it less than ideal for certain situations.

[1] Tailscale Serve and Funnel

First, sites served with Funnel can only have a hostname in the form of `server.tailnet-name.ts.net`. You can't use a custom domain for this, but you might not always want to advertise that a service is shared via Tailscale. Second, Funnel connections have an undisclosed bandwidth limit, which could cause problems if you're hoping to serve media through the Funnel.

For instance, I've started using Immich [2] as a self-hosted alternative to Google Photos. Using Tailscale Serve to make my Immich server available on my Tailnet works beautifully, and I initially set up a Funnel connection to use for when I wanted to share certain photos, videos, and albums externally. I quickly realized that it took *f o r e v e r* to load the page when those links were shared publicly. I probably won't share a lot of those public links but I'd like them to be a bit more responsive when I do.

[2] Immich

I went looking for another solution, and I found one in a suite of products I already use.

Overview

I've been using Cloudflare's generious free plan [3] for DNS, content caching, page/domain redirects, email forwarding, and DDoS mitigation across my dozen or so domains. In addition to these "basic" services and features, Cloudflare also offers a selection of Zero Trust Network Access [4] products, and one of those is Cloudflare Tunnel [5] - also available with a generous free plan.

[3] Cloudflare's generious free plan

[4] Zero Trust Network Access

[5] Cloudflare Tunnel

In some ways, Cloudflare Tunnel is quite similar to Tailscale Funnel. Both provide a secure way to publish a resource on the internet without requiring a public IP address, port forwarding, or firewall configuration. Both use a lightweight agent on your server to establish an encrypted outbound tunnel, and inbound traffic gets routed into that tunnel through the provider's network. And both solutions automatically provision trusted SSL certificates to keep traffic safe and browsers happy.

Tailscale Funnel is very easy to set up, and it doesn't require any additional infrastructure, not even a domain name. There aren't a lot of controls available with Funnel - it's basically on or off, and bound to one of three port numbers. You don't get to pick the domain name where it's served, just the hostname of the Tailscale node - and if you want to share multiple resources on the same host you'll need to get creative [6]. I think this approach is really ideal for quick development and testing scenarios.

[6] need to get creative

For longer-term, more production-like use, Cloudflare Tunnels is a pretty great fit. It ties in well with existing Cloudflare services, doesn't enforce a reduced bandwidth limit, and provides a bit more flexibility for how your resource will be presented to the web. It can also integrate tightly with the rest of Cloudflare's Zero Trust offerings to easily provide access controls to further protect your resource. It does, however, require a custom domain managed with Cloudflare DNS in order to work.

For my specific Immich use case, I decided to share my instance via Tailscale Serve for internal access and Cloudflare Tunnel for public shares, and I used a similar sidecar approach to make it work without too much fuss. For the purposes of this blog post, though, I'm going to run through a less complicated example.

Speedtest Demo

I'm going to deploy a quick SpeedTest by OpenSpeedTest [7] container, and proxy it with both Tailscale Funnel and Cloudflare Tunnel so that I can compare the bandwidth of the two tunnel solutions directly.

[7] SpeedTest by OpenSpeedTest

I'll start with a *very* basic Docker Compose definition for just the Speedtest container:

Tailscale Funnel

And, as in my last post [8] I'll add in my Tailscale sidecar to enable funnel:

[8] my last post

<-- note -->

I set `network_mode: service:tailscale` on the `speedtest` container so that it will share its network interface with the `tailscale` container. This allows Tailscale Serve/Funnel to proxy `speedtest` at `http://localhost:3000`, which is nice since Tailscale doesn't currently/officially support proxying remote hosts.

<-- /note -->

I'll set up a new auth key in the Tailscale Admin Portal [9], and insert that (along with hostname, port, and funnel configs) into my `.env` file:

[9] Tailscale Admin Portal

A quick `docker compose up -d` and my new speedtest is alive!

First I'll hit it at `http://speedtest.tailnet-name.ts.net:3000` to access it purely inside of my Tailnet:

Image: Speedtest from within the tailnet

Not bad! Now let's see what happens when I disable Tailscale on my laptop and hit the public Funnel endpoint at `https://speedtest.tailnet-name.ts.net`:

Image: Speedtest from funnel

Oof. Routing traffic through the Funnel dropped the download by ~25% and the upload by **~90%**, not to mention the significant ping increase.

Cloudflare Tunnel

Alright, let's throw a Cloudflare Tunnel on there and see what happens.

To start that process, I'll log into my Cloudflare dashboard [10] and then use the side navigation to make my way to the **Zero Trust** (AKA "Cloudflare One") area. From there, I'll drill down through **Access -> Tunnels** and click on **+ Create a tunnel**. I'll give it an appropriate name like `speedtest` and then click **Save tunnel**.

[10] Cloudflare dashboard

Now Cloudflare helpfully provides installation instructions for a variety of different platforms. I'm doing that Docker thing so I'll click the appropriate button and review that command snippet:

Image: Tunnel installation instructions

I can easily adapt that and add it to my Docker Compose setup

docker-compose.yml

services:

speedtest:

image: openspeedtest/latest

container_name: speedtest

restart: unless-stopped

network_mode: service:tailscale

tailscale:

image: ghcr.io/jbowdre/tailscale-docker:latest

container_name: speedtest-tailscaled

restart: unless-stopped

environment:

TS_AUTHKEY: ${TS_AUTHKEY:?err}

TS_HOSTNAME: ${TS_HOSTNAME:-tailscale}

TS_STATE_DIR: "/var/lib/tailscale/"

TS_EXTRA_ARGS: ${TS_EXTRA_ARGS:-}

TS_SERVE_PORT: ${TS_SERVE_PORT:-}

TS_FUNNEL: ${TS_FUNNEL:-}

cloudflared:

image: cloudflare/cloudflared

container_name: speedtest-cloudflared

restart: unless-stopped

command:

- tunnel

- --no-autoupdate

- run

- --token

- ${CLOUDFLARED_TOKEN}

network_mode: service:tailscale