概要

まぁ、こんな感じです（多分）
今回のmyPCはM1Macを使用します

なんでこんなの作ったの？

Seleniumでスクレイピングする際に広告が鬱陶しかったので広告ブロックをしようと思いました。
docker-composeの設定ファイルでDNSを設定するだけで良かったんですが、
せっかくなら AdGuardHomeを使用してブロックするものまで編集できたり、ログが取れるようにしちゃえばいいんじゃね？！なんてことを考えたのでせっかくなら記事に書いちゃおうというかんじ。。。w
思い立ったら実現するなんてまさにエンジニア！！（違）

ファイル

tree AdGuard設定前

.
└── docker-compose.yml

tree AdGuard設定後

.
├── adguardhome
│   ├── conf
│   │   └── AdGuardHome.yaml
│   └── work
│       └── data
│           ├── filters
│           ├── querylog.json
│           ├── sessions.db
│           └── stats.db
└── docker-compose.yml

docker-compose.yml

version: "3"
services:
  app:
    image: python:3.10-slim
    tty: true
    depends_on:
      - selenium
      - adguard
    networks:
      myNet:
        ipv4_address: 172.10.0.4
  selenium:
    # M1Macなのでseleniarm用
    image: seleniarm/standalone-firefox:4.0.0-20211213
    ports:
      # 外部からリモート接続するなら公開
      # - 4444:4444
      # VNCポート
      - 5900:5900
    shm_size: "2gb"
    depends_on:
      - adguard
    networks:
      myNet:
        ipv4_address: 172.10.0.3
    dns:
      - 172.10.0.2
  adguard:
    image: adguard/adguardhome:latest
    ports:
      # 公開ポートにする必要はないのでコメントアウト
      # - "53:53/tcp"
      # - "53:53/udp"
      - "80:80/tcp" #初期設定後の管理者ページ
      - "3000:3000/tcp" #初期設定に使用
    volumes:
      - ./adguardhome/work:/opt/adguardhome/work
      - ./adguardhome/conf:/opt/adguardhome/conf
    restart: always
    networks:
      myNet:
        ipv4_address: 172.10.0.2
networks:
  myNet:
    driver: bridge
    driver_opts:
      com.docker.network.bridge.enable_ip_masquerade: "true"
      com.docker.network.bridge.host_binding_ipv4: "0.0.0.0"
      com.docker.network.bridge.name: "docker1"
    ipam:
      config:
        - subnet: 172.10.0.0/29

あとは必要に応じてスクレイピング用のディレクトリとファイルの作成、tty:trueを外してcommand: python script.py等を仕込んでください。
先にAdGuardHomeの設定をするのでひとまずは上記の内容をコピペでいいと思います。

設定に取り掛かる

コンテナの起動

$ docker compose up -d
[+] Running 4/4
 ⠿ Network proj_myNet         Created                                0.1s
 ⠿ Container proj-adguard-1   Started                                0.8s
 ⠿ Container proj-selenium-1  Started                                1.9s
 ⠿ Container proj-app-1       Started

コンテナ内に接続

今回はPythonコンテナから試しにseleniumを起動、
VNC ViewerからAdguardを設定するのでappコンテナに接続します
ローカルで接続する場合は不要ですが、そのまま動作確認を行うのでVNCから確認する方がおすすめ

$ docker compose exec app sh

python3-pipのアップグレードとseleniumのインストールを実施
（一気にやっていいものかはわからないけど...）
インストール終わったらpythonを対話モードで起動

# python -m pip install --upgrade pip selenium
# python

from selenium.webdriver import Remote, ChromeOptions, Chrome
from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
driver = Remote(command_executor="http://selenium:4444",desired_capabilities=DesiredCapabilities.FIREFOX.copy())

これでVNC Viewerで確認するとFireFoxブラウザが起動しているはず

AdGuardHomeの初期設定

VNCから接続している人向け

pythonの対話モードで下記を実行すればVNC Viewerで開くことが確認できるはずです

driver.get("http://adguard")
driver.switch_to.new_window("tab")
driver.get("http://adguard:3000")

ローカルから接続する人向け

ブラウザを起動し、

の二つを開きます

上記のどちらかから対象のページを開きます
ポート指定がないURL（１つ目のタブ）は最初はアクセスできないはずです。

画像

もう一つの3000ポートでアクセスしたURLにはこのような画面が設定されていると思うので進めていきましょう。

画像

VNCからアクセスしている人は英語になっているかもしれないので日本語設定に変更しておきましょう

言語の変更設定

画面右下のEnglishをクリック、プルダウンから読める言語を選択しましょう。

GetStartedを押して次の画面へ。

画像

中央のDNSサーバーの待ち受けインターフェイスだけ変更しておきましょう
docker-compose.ymlのnetworksを弄っていなければ172.10.0.2を選択すればOKです

画像

変更したら次へを選択
アカウントを作成するので自由に作成してください
今回は例としてありがちなダメなやつでやります（どのみちグローバルに開放しませんけどね）

画像

アカウント・パスワードは覚えておいてください、
管理者ページに入るときに使います。
メモったら次へを選択

右下に接続に成功しましたとトーストが出てきたらOK
そのままスクロールして次へを選択しましょう。

画像

はい、設定が完了したようです。
http://adguard か　http://localhost のタブに戻りましょう。

画像

管理画面へ接続

ページを更新します。

画像

先ほど作ったアカウントでログインします

画像

ログインできたらこんな画面になるヨー

画像

Let's Try(失敗します)

新しいタブでqiitaを開いてみましょう

画像

おや？。。。おかしいなぁ...

AdGuardHomeのDNSの設定を確認してみましょう
設定タブ → DNS設定

画像

上流DNSサーバで登録されているサーバーに問い合わせされるようですが
うまくいってないのかな？
ちょっとスクロールすると「上流サーバをテストする」のボタンがあるので押してみましょう

画像

うん、よくわからんけどうまくいってなさそうなのはわかる！！

画像

設定を変更して再トライ（成功する）

ってことでDNSサーバの変更をしましょう

既知のDNSプロバイダの一覧のリンクをクリックして確認しましょう。
今回はAdGuardDNSのdefaultを使用します
Known DNS Providers | AdGuard Knowledgebase

元々のURLは#でコメントアウトできるのでコメントアウト、
AdGuardDNSのIPv4の94.140.14.14を追加します

画像

もう一回、「上流サーバをテストする」で再チャレンジ!

うまくいったようです、適用するで更新しておきましょう。

画像

ダッシュボードに戻ってみると既に通信された模様（Selenium上で操作しているのでそれはそうか）
トップクライアントが今回Seleniumコンテナに設定しているIPv4と一致しているので正しく動作してそうですね。

画像

Qiitaページをリロードして確認してみましょう。
ちゃんと表示されるはずです

画像

ダッシュボードに戻って統計データを最新にするボタンを押して更新してみましょう。
リクエスト数が増加していることが確認できるはず

画像

ついでに適当なページを確認してみましょう
右ペインの広告がなくなっているはずです

画像

まとめの前に

忘れてたけどDNSブロックリストを登録してた方がいいかも

フィルタ　→ DNSリストへ移動
AdGuard DNS filterのチェックボックスにチェックを入れて、アップデートを確認するからアップデートしましょう
ルール数や最終更新時刻が変更されているはずです。

画像

まとめ

「まとめの前に」のDNSブロックリストを登録しないで、今回広告ブロックされたのはAdGuardのDNSを使ったから。。。
DNSブロックリストを変更した上で上流DNSサーバを(Google: 8.8.8.8とか)変更しても広告ブロックされました

ブロックリストを登録しないのであればAdGuardHomeを使用するより、docker-compose.ymlのseleniumコンテナのDNSに直接好きなDNSを登録する方が早いですね（ログは確認できなくなりますが）

DNSブロックリストを登録しておくことで好きなアドレスからの広告ブロックも効きますし、
逆に表示しておきたい広告を許可することも可能です。
今回書いてませんが、ブロックするサービスからTwitterやYoutube等をブロックすることも可能なので、
スクレイピングの際の読み込み時間の短縮にも繋がりそうです。

おまけ

クライアント登録

今後使っていくと思われるのでSeleniumのIPアドレスを登録しておきましょう
設定 → クライアント設定

画像

クライアント　のクライアントを追加するボタンを押して追加しましょう。
設定内容はこんな感じ

画像

登録するとこんな感じでそのIPからのリクエスト数が確認できます
複数建てる場合はこんな感じで設定しておくとどのサーバーでどの程度実行できるのかも確認できますね。

画像

スクレイピングに広告ブロック導入してみた

概要