SOCKSプロキシを経由しないとアクセスできないサイトに対してCypressでE2Eテストを実行する

CX事業本部@大阪の岩田です。

普段は滅多にリモートワークをしない私ですが、新型コロナウイルスの影響でここ２週間ほどリモートワーク生活が続いています。リモートワークあるあるだと思いますが、IP制限のかかったサイトにアクセスする際に少しハマったので社内向けの情報共有としてブログに残しておきます。

環境

今回ためした環境です。

• OS: Mac OS X 10.14.6
• Node.JS: v12.9.1
• Cypress :4.1.0

やりたかったこと

IP制限のかかったサイトにCypressでE2Eテストを流そうとしていました。ざっくり説明するとこんな構成です。

MAC ---(VPN)---> SOCKSプロキシ ---> IP制限のかかったサイト

Cypressでプロキシを指定する方法を調べたところ、環境変数HTTP_PROXYを指定すればプロキシ経由でアクセスできそうです。

Set a proxy on Linux or macOS

SOCKSプロキシの場合も大丈夫なんだろうか...と一抹の不安を覚えつつもとりあえず試してみました。

$ export HTTP_PROXY=socks5://proxy.example.com:1080
$ npm run cypress

プロキシの設定自体はちゃんと入っていそうですが、Warningが出ておりアクセスに失敗してしまいました。

CypressからSocksプロキシを使うのは無理なんでしょうか...

解決方法

先程の公式ドキュメントをよくよく確認するとSocksプロキシに関する記載がありました。

SOCKS proxies are not currently supported. A workaround is to set up an HTTP proxy locally that points to your SOCKS proxy, then using that HTTP proxy with Cypress. Read more about forwarding an HTTP proxy through SOCKS.

Proxy Configuration

現状CypressではSocksプロキシがサポートされていないとのことです。ワークアラウンドとしてSocksプロキシの前段にさらにHTTPプロキシを立てて回避する方法が紹介されていました。こんな構成です。

MAC --->ローカルのHTTPプロキシ---(VPN)---> SOCKSプロキシ ---> IP制限のかかったサイト

ということでローカルにHTTPプロキシを用意します。Docker Hubでdelegatedのイメージが公開されているので、こいつを使ってみます。

$ docker pull vimagick/delegated
$ docker run --rm -p 8080:8080  vimagick/delegated -P8080 SERVER=http SOCKS=proxy.example.com:1080

改めてHTTP_PROXYを設定してCypressを起動します

$ export HTTP_PROXY=http://localhost:8080
$ npm run cypress

無事にアクセスできました！

まとめ

Docker Hubにdelegatedのイメージがあったので、割と楽に解決できました。私のように普段リモートワークしていなかったのに、コロナウイルスの影響でリモートワークをするようになった人はVPNやプロキシ周りでハマることもあるかと思います。そういった方のお役に立てば幸いです。