If you followed the first part of this tutorial, you should be able to access the dashboard of the Traefik instance provided with Pangolin.

We will use this dashboard to easily customize some resources and secure their access with a Traefik middleware.

Secure resources with Basic Auth

Basic Authentication, often referred to as Basic Auth, is a simple authentication scheme built into the HTTP protocol. It allows a client to provide a username and password when making a request. This process works by encoding the username and password as a base64 string, which is then sent in the HTTP Authorization header. The server decodes these credentials and verifies them against its user database. The Authorization header for Basic Auth is formatted as Authorization: Basic <base64-encoded-credentials>.

While Basic Auth is easy to implement, it transmits credentials in plaintext, making it vulnerable to interception unless used over HTTPS. Fortunately, our Pangolin installation provides automatically generated certificates with Let’s Encrypt and Traefik. So, make sure you protect your routes with HTTPS!

For this part, we will secure a resource with the basic auth middleware. Access your dashboard and locate the page detailing the router for it. We need to gather these informations : “service” and “priority”.

traefik router details

ℹ️ Note

Don’t forget to create first a resource in the Pangolin Admin UI, then access the details in the Traefik dashboard and use the values you find while you follow allong!

Now, we need to enable basic auth in Traefik, via the dynamic configuration YAML file.

http:
  # ...
  middlewares:
    # ...
    basic-auth:
      basicAuth:
        users:
          - "test:$apr1$EmS2oPTu$yjNFXugmXzjM7bR40D1ua1" # user: test / pass: example

ℹ️ Note

Use a strong password and generate a pair with the htpasswd command !

In the same file, we need to add a new router to bypass the one generated by Pangolin.

http:
  # ...
  routers:
    # ...
    whoami-example:
      entryPoints:
        - websecure
      middlewares:
        - security-headers
        - basic-auth # the name of the middleware we set earlier
        # you can add crowdsec, geoblock if not attached to the entrypoint
      rule: Host(`whoami.example.com`)
      priority: 30 # always higher than the number who found ealier
      service: 28-service@http # use the value you found earlier and add the suffix "@http"
      tls:
        certresolver: letsencrypt

Browse to your URL, you should be welcomed with a prompt :

basic auth prompt

Congratulations ! You secured your Pangolin installation with Basic Auth ! It can be useful if you need to make automated API calls to a resource

Use case : Custom Glance Widget

If you use Glance, the very nice dashboard, you can add a custom API widget to your homepage !

custom glance widget

Add the following code to your configuration :

- type: custom-api
  title: Traefik Pangolin
  cache: 1d
  url: https://<your traefik URL>/api/overview
  headers:
    Authorization: Basic <base64 encoded user and password joined by a `:`>
    Accept: application/json
  template: |
    <div class="flex justify-between text-center">
      <div>
          <div class="color-highlight size-h3">{{ .JSON.Int "http.routers.total" }}</div>
          <div class="size-h6">Routeurs</div>
      </div>
      <div>
          <div class="color-highlight size-h3">{{ .JSON.Int "http.services.total" }}</div>
          <div class="size-h6">Services</div>
      </div>
      <div>
          <div class="color-highlight size-h3">{{ .JSON.Int "http.middlewares.total" }}</div>
          <div class="size-h6">Middlewares</div>
      </div>
    </div>

And add a new router to the traefik dynamic configuration :

http:
  # ...
  routers:
  # ...
    traefik-pangolin-api:
      entryPoints:
        - websecure
      middlewares:
        - security-headers
        - basic-auth
      rule: Host(`<your traefik URL>`) && Path(`/api/overview`) && HeaderRegexp(`Authorization`, `.+`)
      service: api@internal
      priority: 60
      tls:
        certresolver: letsencrypt

If you are wondering why we are adding a new router, it is because we will change the router from part one in the next part of this tutorial with another auth middleware !

Thanks for following this guide !