Как мой контейнерный кукловод может общаться с моим компьютером Chrome?

Question

Я заставил Puppeteer работать в контейнере, который имеет собственный Chrome / Chromium без головы, и он будет подключаться к моему веб-приложению, работающему в другом контейнере. Все отлично работает.

Я бы хотел, чтобы Puppeteer внутри контейнера запустил мое веб-приложение, используя мои хост-машины Google Chrome (или Chromium, это не имеет значения). Я искал что-то подобное, но мне не повезло найти документацию по этому вопросу.

Как я могу это сделать?

Answer 1

Указание кукловоду подключиться к экземпляру chrome на локальном компьютере вместо версии без монитора в контейнере докера

1. Запустите chrome / chromium в режиме отладки, запустив /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 на терминале. Это должно дать вам URL отладки Websocket. Это должно выглядеть так: ws://host.docker.internal:9222/devtools/browser/d7db2629-0930-4741-a6ca-78ff70863c20.

2. В вашей настройке docker dev, скажите docker выставить порт 9222. Это порт отладки Chrome, который мы указали. В yml-части службы, выполняющей кукловод, выполните:

service-name:
  build: "..."
  volumes:
    - ....
    - ....
  ports:
    - 3010:3010
    - 9222:9222  <--- Add this

А затем повторно инициализировать / перезапустить докер-контейнеры

docker-compose down
docker-compose up

3. Теперь в коде изменить:

const browser = await puppeteer.launch({ args });

до

const browser = await puppeteer.connect({
  browserWSEndpoint:
    "ws://host.docker.internal:9222/devtools/browser/d7db2629-0930-4741-a6ca-78ff70863c20"
});

Теперь кукловод должен подключиться к Chrome на вашей локальной машине, и вы должны увидеть, как он выполняет все действия вживую! ?

PS:

или Если вы не хотите копировать сгенерированный URL снова и снова. Вы можете сделать

const response = await axios.get(
  "http://host.docker.internal:9222/json/version",
  {
    headers: { Host: "127.0.0.1:9222" }
  }
);
const browserWSEndpoint = response.data.webSocketDebuggerUrl.replace(
  /127.0.0.1/g,
  "host.docker.internal"
);
const browser = await puppeteer.connect({ browserWSEndpoint });

Это может получить отладочный URL веб-сокета из chrome

Answer 2

Вы можете указать кукольника на исполняемый файл Chrome / Chromium, который вы хотели бы использовать в puppeteer.launch метод:

puppeteer.launch({ executablePath : 'path/to/chromium" }); 

Таким образом, теоретически вы можете смонтировать каталог с Chromium с хоста на Docker и указать на него кукловода.