3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

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

Posted at

#概要
selenium-adguard.png
まぁ、こんな感じです(多分)
今回の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
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(1つ目のタブ)は最初はアクセスできないはずです。

画像
![スクリーンショット 2021-12-19 17.59.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/a88a0a8b-f08a-e89d-ed67-a6275de39b65.png)

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

画像
![スクリーンショット 2021-12-19 17.59.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/cbe6e2cc-3d92-e5cb-4c56-fee2093464a5.png)

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

言語の変更設定
画面右下のEnglishをクリック、プルダウンから読める言語を選択しましょう。 ![スクリーンショット 2021-12-19 17.59.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/ca1b5fe7-5551-5df2-d52a-bd3b5530b48f.png) ![スクリーンショット 2021-12-19 17.59.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/168fb9cb-b844-ae47-2375-ebcd6a06c12a.png)

GetStartedを押して次の画面へ。

画像
![スクリーンショット 2021-12-19 17.59.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/22ad7be6-0a64-1d7b-f003-0b7e159e5ae1.png)

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

画像
![スクリーンショット 2021-12-19 17.59.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/d7e9288c-4a79-53cf-f2ad-1748a691f5d0.png)

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

画像
![スクリーンショット 2021-12-19 18.00.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/af3041de-7c32-b1f8-43b3-6c3be06c67e6.png)

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

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

画像
![スクリーンショット 2021-12-19 18.00.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/f6d0ea6f-3392-f1b7-ef81-bab6ce9e6129.png)

スクリーンショット 2021-12-19 18.00.16.png

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

画像
![スクリーンショット 2021-12-19 18.00.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/df134a69-1f4e-840f-aaf7-14230a7b0efc.png)

管理画面へ接続

ページを更新します。

画像
![スクリーンショット 2021-12-19 18.00.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/a0180d24-0405-920f-1ef9-d19b1905a95b.png)

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

画像
![スクリーンショット 2021-12-19 18.00.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/7874b472-205c-6fd5-dc27-b4cefd0ce596.png) ![スクリーンショット 2021-12-19 18.00.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/e759136f-0e56-6299-e445-722fe8d5a1ee.png)

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

画像
![スクリーンショット 2021-12-19 18.00.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/475bc841-4876-3c00-86af-89563d7aea4b.png)

Let's Try(失敗します)

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

画像
![スクリーンショット 2021-12-19 18.00.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/32621408-e2e3-16ef-e15d-256bcae5efc6.png)

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

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

画像
![スクリーンショット 2021-12-19 18.01.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/cd78af42-7999-15b3-2b68-206a2ba7a0e2.png)

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

画像
![スクリーンショット 2021-12-19 18.01.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/18c587f1-6952-d567-3813-8ac32e6e405f.png)

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

画像
![スクリーンショット 2021-12-19 18.01.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/7bcb5804-6946-66fe-ef23-2330ea75902e.png)

設定を変更して再トライ(成功する)

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

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

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

画像
![スクリーンショット 2021-12-19 18.02.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/1d826caf-5bb6-8a39-c485-870997b726ba.png)

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

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

画像
![スクリーンショット 2021-12-19 18.02.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/30f8a73b-ff28-45f6-7f0a-40f3ce9f9407.png) ![スクリーンショット 2021-12-19 18.02.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/772583dd-e05e-bd0c-55e8-b72a04935677.png)

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

画像
![スクリーンショット 2021-12-19 18.02.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/988e6dc9-4533-43da-d5b9-7f23a77265a2.png)

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

画像
![スクリーンショット 2021-12-19 18.02.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/319c9089-6d06-1f75-689f-e2977bade393.png)

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

画像
![スクリーンショット 2021-12-19 18.02.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/493072ef-589e-0ed0-2300-9e85cc2d39aa.png) ![スクリーンショット 2021-12-19 18.03.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/04bd1d0f-fea8-331d-adf2-691e0b8471f9.png)

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

画像
![スクリーンショット 2021-12-19 18.03.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/b3b46717-8d04-972c-fdf0-b13683984746.png)

#まとめの前に

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

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

画像
![スクリーンショット 2021-12-19 18.06.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/b4b3d9f7-339f-7293-1985-a65d29d2f14d.png)

まとめ

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

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

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

おまけ

クライアント登録

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

画像
![スクリーンショット 2021-12-19 18.04.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/1e3bbf82-086b-20a5-6f38-75d9384b570a.png)

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

画像
![スクリーンショット 2021-12-19 18.05.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/e2cc5673-d32e-ef52-b2c5-848575732e46.png)

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

画像
![スクリーンショット 2021-12-19 18.05.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565925/74e22334-dccc-088b-9a97-c12b8137dacc.png)
3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?