Skip to main content

Implement the 'Front Door' Pattern

The "front door" pattern involves using a Cloud Endpoint, the forward-internal Traffic Policy action, and an internal Agent Endpoint to route traffic from the public internet to your service(s).

With this pattern, you can:

  • Host any number of services under a single hostname (e.g. your-company.com) and route to them by path, subdomain, headers, or more.
  • Apply certain policies like authentication at your gateway, then layer in other policies for specific services.
  • Prevent your services or their host systems from being exposed to the public internet.
  • Route traffic and add authentication to microservices with a single API gateway configuration.
  • Authenticate developer environments or CI preview builds behind a single endpoint.

1. Create an endpoint for your service

Start an internal Agent Endpoint, replacing $PORT based on where your service listens. You can also use one of our SDKs or the Kubernetes Operator.

Loading…

2. Reserve a domain

Navigate to the Domains section of the ngrok dashboard and click New + to reserve a free static domain like https://your-service.ngrok.app or a custom domain you already own.

3. Create a Cloud Endpoint

Navigate to the Endpoints section of the ngrok dashboard, then click New + and Cloud Endpoint. Now you have a Cloud Endpoint with the URL like https://your-service.ngrok.app.

4. Add routing to your service with Traffic Policy

While still viewing your new cloud endpoint in the dashboard, copy and paste the policy below into the Traffic Policy editor.

Loading…

What's happening here?

The traffic policy engine forwards all HTTP requests to the internal agent endpoint you created at https://service.internal.

5. Try out your endpoint

Visit the domain you reserved either in the browser or in the terminal using a tool like curl. You should see the app or service at the port connected to your internal Agent Endpoint.

Add a second service and routing (optional)

If you have another service to host under the front door pattern, start another agent.

Loading…

Update your routing based on paths

Copy and paste the policy below into the ngrok dashboard, replacing /one and /two with the paths you'd like to use for routing traffic to each service.

Loading…

What's happening here?

The traffic policy engine forwards all HTTP requests to the /one path to the internal agent endpoint at https://service.internal and requests to the /two path to https://service-two.internal.

What's next?

← Check out more examples