Dockerでプロクシサーバで外部アクセス禁止されているサイトを表示

Yahoo！(https://yahoo.com')みたいなCORS Proxyによってiframeに外部アクセス禁止されているサイトを表示したい。

！注意！対象ウェブサイトの利用規約や法律を確認し、問題がないことを確認してから実装してください。 これ見たからと言って僕を訴えないでね。

オープンソースのCORSプロキシ、CORS-Anywhereを使う。 GitHub - Rob--W/cors-anywhere: CORS Anywhere is a NodeJS reverse proxy which adds CORS headers to the proxied request.

テキトーな名前のフォルダ作る。

mkdir proxy_proj
cd proxy_proj

ディレクトリ内にDockerfileの作成。

# ベースイメージとしてNode.jsを使用
FROM node:14

# 作業ディレクトリの設定
WORKDIR /app

# CORS-Anywhereのリポジトリをクローン
RUN git clone https://github.com/Rob--W/cors-anywhere.git .

# 依存関係をインストール
RUN npm install

# CORS-Anywhereを実行するためのポートを設定
EXPOSE 8080

# CORS-Anywhereを起動
CMD ["node", "server.js"]

同じディレクトリにdocker-compose.ymlファイルを作成

version: '3'
services:
  cors-anywhere:
    build: .
    ports:
      - "8080:8080"

Dockerイメージをビルドし、Dockerコンテナを起動します。 ※Docker本体起動忘れないように！

docker-compose up -d

HTMLの作成

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Display XMLHttpRequest Data in Iframe with CORS Proxy</title>
    <script>
        function loadIframeContent() {
            var proxyUrl = 'https://cors-anywhere.herokuapp.com/';
            var targetUrl = 'https://yahoo.com';
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    var iframe = document.getElementById("myIframe");
                    iframe.contentDocument.open();
                    iframe.contentDocument.write(xhr.responseText);
                    iframe.contentDocument.close();
                }
            };
            xhr.open("GET", proxyUrl + targetUrl, true);
            xhr.send();
        }
        
        window.onload = function() {
            loadIframeContent();
        }
    </script>
</head>
<body>
    <iframe id="myIframe" style="width:100%;height:500px;"></iframe>
</body>
</html>

万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

Dockerでプロクシサーバで外部アクセス禁止されているサイトを表示