View Source PlausibleWeb.Favicon (Plausible v0.0.1)

A Plug that fetches favicon images from DuckDuckGo and returns them to the Plausible frontend.

The proxying is there so we can reduce the number of third-party domains that the browser clients need to connect to. Our goal is to have 0 third-party domain connections on the website for privacy reasons.

This module also maps between categorized sources and their respective URLs for favicons. What does that mean exactly? During ingestion we use PlausibleWeb.RefInspector.parse/1 to categorize our referrer sources like so:

google.com -> Google google.co.uk -> Google google.com.au -> Google

So when we show Google as a source in the dashboard, the request to this plug will come as: https://plausible/io/favicon/sources/Google

Now, when we want to show a favicon for Google, we need to convert Google -> google.com or some other hostname owned by Google: https://icons.duckduckgo.com/ip3/google.com.ico

The mapping from source category -> source hostname is stored in "priv/referer_favicon_domains.json" and managed by Mix.Tasks.GenerateReferrerFavicons.run/1

Summary

Functions

call(conn, list)

Proxies HTTP request to DuckDuckGo favicon service. Swallows hop-by-hop HTTP headers that should not be forwarded as defined in RFC 2616

init(_)

Functions

call(conn, list)

Proxies HTTP request to DuckDuckGo favicon service. Swallows hop-by-hop HTTP headers that should not be forwarded as defined in RFC 2616

Placeholder

Cases where we show a placeholder icon instead:

In case of network error to DuckDuckGo
In case of non-2xx status code from DuckDuckGo
In case of broken image response body from DuckDuckGo

I'm not sure why DDG sometimes returns a broken PNG image in their response but we filter that out. When the icon request fails, we show a placeholder favicon instead. The placeholder is an emoji from https://favicon.io/emoji-favicons/

DuckDuckGo favicon service has some issues with SVG favicons. For some reason, they return them with content-type=image/x-icon whereas SVG icons should be returned with content-type=image/svg+xml. This Plug detects when the response body starts with <svg and will override the Content-Type to correct it.

Preventing XSS vulnerabilities

SVGs may contain <script> tags, and as these SVGs come from external sources, we need to prevent untrusted code from running on the browser.

This Plug sets a strict Content-Security-Policy header telling the browser not to run scripts.
This Plug sets Content-Disposition=attachment to prevent the SVG from rendering when navigating to /favicon/sources/:domain directly.
Browsers do not execute scripts from <img> tags, therefore it is safe to use <img src="https://plausible.io/favicon/sources/dummy.site"></img>