What is Cotunnel and how does it work?

Unlocking localhost tunneling has become an effortless endeavor today. Developers and testers now have seamless access to local web servers, facilitating the effortless sharing, testing, and debugging of web applications with collaborators. In this article, we will explore and dive deep into the internal mechanism of Cotunnel and understand how it works.

What is Cotunnel?

First, a quick refresher on what Cotunnel actually is.

Cotunnel is a cross-platform application that allows developers to expose their local web servers to the internet. It hosts a local web server on its own sub-domain and makes your local development box available on the internet through Tunnelling.

Use Cases of Cotunnel

Cotunnel is a great tool when it comes to testing local applications as if they were hosted on a server. You can use it to test applications in collaboration with other developers or testers, users and stakeholders without having to deploy your application to an environment.

For instance, let’s say you have a front-end web app in React. Now you want other developers to be able to see your React app in your development environment. You can use Cotunnel to generate a public URL for your local web server. Then, other developers can see your React app in a development environment.

To demonstrate, here I have a React app running locally on port 3000

Install Cotunnel

Go to cotunnel.com, register and login. Click add a new device button. The popup will appear please follow the instructions by your platform. You can watch the video about Cotunnel installation progress.

After the installation progress finished. You can visit tunnels tab in the Cotunnel dashboard.

You can also modify the tunnel port settings. We have configured the device input port to be 3000 since our React app is running on port 3000.

And now anyone can visit my local React app using the tunnel url provided by Cotunnel. You can see your Cotunnel url in the Tunnels tab.

That’s literally how easy it is actually to start using Cotunnel. Additionally, you can also use Cotunnel to test webhooks.
Let’s say you want to build a Stripe application. Stripe will need to send events to your application via webhooks. However, since you’re developing locally, Slack won’t be able to provide a webhook to your local development server. With Cotunnel, you can generate a URL that maps to your local server, and Stripe can now send you webhooks on this URL. Therefore, you can easily test your Stripe application with events from Stripe in real time when in development mode using Cotunnel.

Internet Architecture and Cotunnel

Let’s delve into the intricacies of Cotunnel. To comprehend Cotunnel’s operation, we must initially comprehend the internet architecture that oversees it.

The internet works on the end-to-end principle, where any machine can act as a server or a client. Each device has a unique IP address, but device IP addresses are private. Your router, on the other hand, has a public IP address that your devices use to communicate with websites over the internet. This is how websites interact with your machine when it’s a client requesting resources from different machines on the internet.

Now when you run a local development server, your own device is a server, but it’s not on the internet. Remember your device has a private IP address that any other device cannot access. So there’s no direct mechanism for another device to access a local development server running on your own machine. For anyone to make a request to your local server, they need your private IP address. Now routers don’t just expose private IP addresses for security reasons. This is where Cotunnel comes in. It maps your local development server to its own server.

So now, if someone needs to access your local development server, they make a request to Cotunnel’s server. Cotunnel’s server has a public IP address that anyone can access over the internet.

So how, the question is, how does Cotunnel achieve this behavior? How does Cotunnel map a local development server to its own server? Let’s find out.

How does Cotunnel Work?

When you use Cotunnel, you start it on your local machine and specify the port number of the local server that you want to expose. When you do that, Cotunnel creates a secure tunnel to a public endpoint (cotunnel.com subdomain) that is accessible over the internet.

So now, all the traffic to the public endpoint is forwarded as a request to the local server running on your machine. Your local server responds back to this request or traffic back to this public endpoint. This is also called port forwarding or localhost tunneling. This is the underlying principle through which Cotunnel maps your local development server to one of its own servers, making it seem like it’s just your local development server hosted somewhere.

Cotunnel creates a secure connection between the public endpoint and your local machine so that traffic is encrypted and secure. When the request arrives at the public endpoint, it is encrypted and forwarded to your local server. Cotunnel uses a combination of cryptography and network routing techniques to create a secure and reliable connection between the public endpoint and your local machine. Cotunnel allows you to tunnel your local server easily while ensuring that the security is intact.