feat: 内部で仮想ディスプレイ作ってHeadfulに

Author: book000

README.md

@@ -71,3 +71,5 @@ sequenceDiagram
 ## その他
 
 - 文字起こしコンテナが残った場合: `docker rm $(docker ps -f "name=chatwatcher-recognizer" -q -a)`
+- 文字起こしコンテナを別で立ち上げる場合: `docker run --rm --name chatwatcher-recognizer -p 5900:5900 -e DISPLAY=:99 -e RECOGNIZER_HEADLESS=false -e CHATWATCHER_ROOM_ID=597378876556967936-271615744947650562 --net=chatwatcher-network ghcr.io/jaoafa/chatwatcher-recognizer`
+  - VNC で `localhost:5900` にアクセスして画面を確認できる

recognizer/Dockerfile

@@ -14,6 +14,11 @@ RUN apk update && \
   ttf-freefont \
   nodejs \
   yarn \
+  xvfb \
+  xauth \
+  dbus \
+  dbus-x11 \
+  x11vnc \
   pulseaudio \
   pulseaudio-utils && \
   apk add --update --no-cache tzdata && \
@@ -38,5 +43,8 @@ RUN chmod +x entrypoint.sh
 
 USER speech-recognizer:speech-recognizer
 
+ENV RECOGNIZER_HEADLESS false
+ENV DISPLAY :99
+
 ENTRYPOINT ["dumb-init", "--"]
 CMD ["/app/entrypoint.sh"]

recognizer/entrypoint.sh

@@ -9,4 +9,7 @@ pacmd set-default-source VirtualMic
 
 pacmd load-module module-native-protocol-unix socket=/tmp/pulseaudio.socket
 
+Xvfb :99 -ac -screen 0 1280x1024x16 -listen tcp &
+x11vnc -forever -noxdamage -display :99 &
+
 yarn build

recognizer/src/main.ts

@@ -24,7 +24,7 @@ async function main() {
       "--disable-gpu",
       "--ignore-certificate-errors",
       "--allow-running-insecure-content",
-      "--window-size=300,300",
+      "--window-size=1280,1024",
     ],
     ignoreDefaultArgs: ["--mute-audio"],
   };

web/html/js/script.js

@@ -76,7 +76,7 @@ function getRoomId() {
   return url.searchParams.get("roomId");
 }
 function connect() {
-  socket = io.connect("ws://chatwatcher:9092");
+  socket = io.connect("ws://watcher:9092");
   socket.emit("join", getRoomId());
   socket.on("audio", function (file) {
     console.log("audio event");