website/public/blog/adblock-blocky/index.html

27 lines
15 KiB
HTML

<!doctype html><html lang=en><head><meta charset=utf-8><meta content="width=device-width,initial-scale=1.0" name=viewport><meta content="light dark" name=color-scheme><title>DNS-level adblock on the go with blocky</title><link href=/img/favicon-32x32.png rel=icon sizes=32x32 type=image/png><link href=/img/favicon-16x16.png rel=icon sizes=16x16 type=image/png><link href=/img/apple-touch-icon.png rel=apple-touch-icon sizes=180x180><link href=https://fonts.googleapis.com rel=preconnect><link crossorigin href=https://fonts.gstatic.com rel=preconnect><link href="https://fonts.googleapis.com/css2?family=Signika&display=swap" rel=stylesheet><style>*{font-family:monospace!important}body{--primary-color:#8070c6;--primary-pale-color:#8070c61c;--text-color:#151517;--text-pale-color:#454449;--bg-color:#f4f0f3;--highlight-mark-color:#5f75b045;--callout-note-color:#e887bb;--callout-important-color:#a292e8;--callout-warning-color:#d9d564;--callout-alert-color:#f06969;--callout-question-color:#78b9c4;--callout-tip-color:#91d65c}body.dark{--primary-color:#a292e8;--primary-pale-color:#a292e81c;--text-color:#ece5ea;--text-pale-color:#5c5c61;--bg-color:#151517;--highlight-mark-color:#5f75b045;--callout-note-color:#e887bb;--callout-important-color:#a292e8;--callout-warning-color:#d9d564;--callout-alert-color:#f06969;--callout-question-color:#78b9c4;--callout-tip-color:#91d65c}body{--main-font:'Signika',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--code-font:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--homepage-max-width:750px;--main-max-width:750px;--avatar-size:70px;--avatar-radius:0;--paragraph-font-size:18px;--paragraph-line-height:1.75;--aside-font-size:16px;--img-border-radius:0;--inline-code-border-radius:2px}</style><link href=/main.css rel=stylesheet><body class=post><script>if(localStorage.getItem('theme')=='dark'){document.body.classList.add('dark');const a=document.querySelector('link#hl');if(a)a.href='/hl-dark.css'}</script><header class=blur><div id=header-wrapper><nav><a href=/>devraza</a><button aria-label="toggle expand" class=separator id=toggler>::</button><span class="wrap left fold">{</span><a href=/blog>blog</a><span class="wrap-separator fold">,</span><a class=fold href=/projects>projects</a><span class="wrap right fold">} ;</span></nav><div id=btns><a aria-label="rss feed" href=/blog/feed.xml><svg viewbox="0 0 24 24" height=24 width=24 xmlns=http://www.w3.org/2000/svg><path d="M3 17C5.20914 17 7 18.7909 7 21H3V17ZM3 10C9.07513 10 14 14.9249 14 21H12C12 16.0294 7.97056 12 3 12V10ZM3 3C12.9411 3 21 11.0589 21 21H19C19 12.1634 11.8366 5 3 5V3Z" fill=currentColor></path></svg></a><button aria-label="theme switch" data-moon-icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M10 7C10 10.866 13.134 14 17 14C18.9584 14 20.729 13.1957 21.9995 11.8995C22 11.933 22 11.9665 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C12.0335 2 12.067 2 12.1005 2.00049C10.8043 3.27098 10 5.04157 10 7ZM4 12C4 16.4183 7.58172 20 12 20C15.0583 20 17.7158 18.2839 19.062 15.7621C18.3945 15.9187 17.7035 16 17 16C12.0294 16 8 11.9706 8 7C8 6.29648 8.08133 5.60547 8.2379 4.938C5.71611 6.28423 4 8.9417 4 12Z" fill="currentColor"></path></svg>' data-sun-icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z" fill="currentColor"></path></svg>' id=theme-toggle><svg viewbox="0 0 24 24" height=24 width=24 xmlns=http://www.w3.org/2000/svg><path d="M10 7C10 10.866 13.134 14 17 14C18.9584 14 20.729 13.1957 21.9995 11.8995C22 11.933 22 11.9665 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C12.0335 2 12.067 2 12.1005 2.00049C10.8043 3.27098 10 5.04157 10 7ZM4 12C4 16.4183 7.58172 20 12 20C15.0583 20 17.7158 18.2839 19.062 15.7621C18.3945 15.9187 17.7035 16 17 16C12.0294 16 8 11.9706 8 7C8 6.29648 8.08133 5.60547 8.2379 4.938C5.71611 6.28423 4 8.9417 4 12Z" fill=currentColor></path></svg></button><button aria-label="table of content" id=toc-toggle><svg viewbox="0 0 24 24" height=24 width=24 xmlns=http://www.w3.org/2000/svg><path d="M3 4H21V6H3V4ZM3 11H15V13H3V11ZM3 18H21V20H3V18Z" fill=currentColor></path></svg></button></div></div></header><div id=wrapper><div id=blank></div><aside class=blur><nav><ul><li><a class=h2 href=#introduction>Introduction</a><li><a class=h2 href=#dns>DNS?</a><li><a class=h2 href=#setting-up-blocky>Setting up blocky</a> <ul><li><a class=h3 href=#nixos-configuration>NixOS configuration</a><li><a class=h3 href=#making-it-work-everywhere>Making it work everywhere</a></ul><li><a class=h2 href=#finishing-thoughts>Finishing thoughts</a></ul></nav><button aria-label="back to top" id=back-to-top><svg viewbox="0 0 24 24" height=24 width=24 xmlns=http://www.w3.org/2000/svg><path d="M11.9997 10.8284L7.04996 15.7782L5.63574 14.364L11.9997 8L18.3637 14.364L16.9495 15.7782L11.9997 10.8284Z" fill=currentColor></path></svg></button></aside><main><div><div data-check-icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M10.0007 15.1709L19.1931 5.97852L20.6073 7.39273L10.0007 17.9993L3.63672 11.6354L5.05093 10.2212L10.0007 15.1709Z" fill="currentColor"></path></svg>' data-copy-icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M6.9998 6V3C6.9998 2.44772 7.44752 2 7.9998 2H19.9998C20.5521 2 20.9998 2.44772 20.9998 3V17C20.9998 17.5523 20.5521 18 19.9998 18H16.9998V20.9991C16.9998 21.5519 16.5499 22 15.993 22H4.00666C3.45059 22 3 21.5554 3 20.9991L3.0026 7.00087C3.0027 6.44811 3.45264 6 4.00942 6H6.9998ZM5.00242 8L5.00019 20H14.9998V8H5.00242ZM8.9998 6H16.9998V16H18.9998V4H8.9998V6Z" fill="currentColor"></path></svg>' id=copy-cfg style=display:none></div><article data-backlink-icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20"><path d="M9.41421 8L18.0208 16.6066L16.6066 18.0208L8 9.41421V17H6V6H17V8H9.41421Z" fill="currentColor"></path></svg>' class=prose><h1>DNS-level adblock on the go with blocky</h1><div id=post-info><div id=date><span id=publish>2024-05-31</span></div><div id=tags><a href=https://devraza.giize.com/tags/blocky><span>#</span>blocky</a><a href=https://devraza.giize.com/tags/adblock><span>#</span>adblock</a><a href=https://devraza.giize.com/tags/headscale><span>#</span>headscale</a><a href=https://devraza.giize.com/tags/tailscale><span>#</span>tailscale</a></div></div><h1 id=introduction>Introduction<a aria-label="Anchor link for: introduction" class=zola-anchor href=#introduction>#</a></h1><p>An adblocker is something you commonly find installed in browsers, usually through an extension. However, what if you wanted an adblocking system that was a bit deeper? Something that doesn't require a browser extension, and gives you a consistent adblocking system? This is where DNS-level adblockers like <a rel="nofollow noreferrer" href=https://adguard.com/en/adguard-home/overview.html>AdGuard Home</a> or <a rel="nofollow noreferrer" href=https://pi-hole.net>Pi-hole</a> come in.<h1 id=dns>DNS?<a aria-label="Anchor link for: dns" class=zola-anchor href=#dns>#</a></h1><p>DNS stands for <strong>D</strong>omain <strong>N</strong>ame <strong>S</strong>ystem. It's what points URLs like <code>https://duck.com</code> to an IP address (like <code>52.142.124.215</code>), making it much easier to find things on the internet.<p>DNS-level adblockers work by filtering out queries for URLs pointing to IP addresses serving ads. In this blog post, I'll use <a rel="nofollow noreferrer" href=https://0xerr0r.github.io/blocky>blocky</a> as an example of one such adblocker for demonstration purposes.<h1 id=setting-up-blocky>Setting up blocky<a aria-label="Anchor link for: setting-up-blocky" class=zola-anchor href=#setting-up-blocky>#</a></h1><h2 id=nixos-configuration>NixOS configuration<a aria-label="Anchor link for: nixos-configuration" class=zola-anchor href=#nixos-configuration>#</a></h2><p>There's a configuration option for <code>blocky</code> provided by NixOS, so you can enable and configure it in your NixOS config:<pre class=language-nix data-lang=nix data-linenos style=background:#151515;color:#e8e8d3><code class=language-nix data-lang=nix><table><tbody><tr><td>1<td><span style=color:#ffb964>services</span><span>.</span><span style=color:#ffb964>blocky </span><span>= {
</span><tr><td>2<td><span> </span><span style=color:#ffb964>enable </span><span>= true;
</span><tr><td>3<td><span> </span><span style=color:#ffb964>settings </span><span>= {
</span><tr><td>4<td><span> </span><span style=color:#ffb964>prometheus</span><span>.</span><span style=color:#ffb964>enable </span><span>= true;
</span><tr><td>5<td><span> </span><span style=color:#ffb964>blocking </span><span>= {
</span><tr><td>6<td><span> </span><span style=color:#ffb964>blackLists</span><span>.</span><span style=color:#ffb964>ads </span><span>= [
</span><tr><td>7<td><span> </span><span style=color:#99ad6a>"https://raw.githubusercontent.com/StevenBlack/hosts/master/hosts"
</span><tr><td>8<td><span> </span><span style=color:#99ad6a>"https://sysctl.org/cameleon/hosts"
</span><tr><td>9<td><span> </span><span style=color:#99ad6a>"https://s3.amazonaws.com/lists.disconnect.me/simple_ad.txt"
</span><tr><td>10<td><span> </span><span style=color:#99ad6a>"https://s3.amazonaws.com/lists.disconnect.me/simple_tracking.txt"
</span><tr><td>11<td><span> ];
</span><tr><td>12<td><span> </span><span style=color:#ffb964>clientGroupsBlock </span><span>= {
</span><tr><td>13<td><span> </span><span style=color:#ffb964>default </span><span>= [ </span><span style=color:#99ad6a>"ads" </span><span>];
</span><tr><td>14<td><span> };
</span><tr><td>15<td><span> };
</span><tr><td>16<td><span> </span><span style=color:#ffb964>upstreams </span><span>= {
</span><tr><td>17<td><span> </span><span style=color:#ffb964>groups</span><span>.</span><span style=color:#ffb964>default </span><span>= [
</span><tr><td>18<td><span> </span><span style=color:#99ad6a>"9.9.9.9"
</span><tr><td>19<td><span> </span><span style=color:#99ad6a>"1.1.1.1"
</span><tr><td>20<td><span> ];
</span><tr><td>21<td><span> };
</span><tr><td>22<td><span> </span><span style=color:#ffb964>ports </span><span>= {
</span><tr><td>23<td><span> </span><span style=color:#ffb964>dns </span><span>= </span><span style=color:#99ad6a>"0.0.0.0:53"</span><span>;
</span><tr><td>24<td><span> };
</span><tr><td>25<td><span> };
</span><tr><td>26<td><span>};
</span></table></code></pre><blockquote class="callout alert"><div class=icon><svg viewbox="0 0 24 24" height=20 width=20 xmlns=http://www.w3.org/2000/svg><path d="M4.00098 20V14C4.00098 9.58172 7.5827 6 12.001 6C16.4193 6 20.001 9.58172 20.001 14V20H21.001V22H3.00098V20H4.00098ZM6.00098 20H18.001V14C18.001 10.6863 15.3147 8 12.001 8C8.68727 8 6.00098 10.6863 6.00098 14V20ZM11.001 2H13.001V5H11.001V2ZM19.7792 4.80761L21.1934 6.22183L19.0721 8.34315L17.6578 6.92893L19.7792 4.80761ZM2.80859 6.22183L4.22281 4.80761L6.34413 6.92893L4.92991 8.34315L2.80859 6.22183ZM7.00098 14C7.00098 11.2386 9.23956 9 12.001 9V11C10.3441 11 9.00098 12.3431 9.00098 14H7.00098Z" fill=currentColor></path></svg></div><div class=content><p><strong>Why isn't it running?</strong><p>You might need to reboot after running a <code>nixos-rebuild switch</code>, or move/kill any process running on port <code>53</code> for this to work.</div></blockquote><blockquote class="callout note"><div class=icon><svg viewbox="0 0 24 24" height=20 width=20 xmlns=http://www.w3.org/2000/svg><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z" fill=currentColor></path></svg></div><div class=content><p><strong>Custom DNS mapping</strong><p>You can use blocky to map a domain of your choice to an IP of your choice - refer to the <a rel="nofollow noreferrer" href=https://0xerr0r.github.io/blocky/latest/configuration/>documentation</a> for more information.</div></blockquote><p>Here, I've used two upstream nameservers for blocky to forward valid DNS requests to (since blocky doesn't do any DNS resolution itself - except for custom mapping, detailed later). One is <a rel="nofollow noreferrer" href=https://one.one.one.one>Cloudflare's DNS</a> (<code>1.1.1.1</code>) and the other is <a rel="nofollow noreferrer" href=https://quad9.net>Quad9</a> (<code>9.9.9.9</code>).<p>As indicated by lines 6 through 11, you need to add lists containing URLs you want to be filtered from your DNS requests.<h2 id=making-it-work-everywhere>Making it work everywhere<a aria-label="Anchor link for: making-it-work-everywhere" class=zola-anchor href=#making-it-work-everywhere>#</a></h2><p>The thing is, you'll need to set the IP address of the machine running blocky as a nameserver for all of your workstations - it just won't recieve any requests otherwise, so it won't be <em>doing</em> any adblocking if you don't do this.<p>Of course, if you've got a router worth keeping around, you should be able to set a network-wide DNS resolver, and you can point this to your blocky-running machine in your router's settings.<p>However, what if you wanted to have this work everywhere you go, perhaps on a portable laptop? Well, if you're using <a rel="nofollow noreferrer" href=https://tailscale.com>Tailscale</a> or <a rel="nofollow noreferrer" href=https://headscale.net>Headscale</a> you can just can edit the nameservers you use in your VPN's settings and set it to the <em>IP address</em> of the device running blocky. This way, any device on your VPN can utilise blocky and have a functioning DNS-level adblocker no matter where you are.<p>If you're looking to setup headscale, I've made <a href=../selfhost-tailscale>a blog post about it</a>.<h1 id=finishing-thoughts>Finishing thoughts<a aria-label="Anchor link for: finishing-thoughts" class=zola-anchor href=#finishing-thoughts>#</a></h1><p>With the existence of browser extensions doing the same thing adblockers like blocky and Pi-hole can, not everyone is going to need something this sophisticated. I think something like this is better suited to those looking for better coverage in their adblocking, or something that gives more control over DNS requests - for example, to easily setup custom DNS mappings or to restrict access to certain websites.</article><div class=giscus></div></div><footer><div class=copyright><p>© 2023-2024 Muhammad Nauman Raza</div><div class=credits>powered by <a rel="noreferrer noopener" href=https://www.getzola.org target=_blank>zola</a> and <a rel="noreferrer noopener" href=https://github.com/isunjn/serene target=_blank>serene</a></div></footer></main></div><script src=/js/lightense.min.js></script><script src=/js/main.js></script>