[Bug] InvalidBrowserConnection with Chrome service

[mrodus]

Is there an existing issue for this?

• Yes, I have searched the existing issues and none of them match my problem.

Product Variant

Self-Hosted

Current Behavior

When trying to download the resume as a PDF, an empty about:blank page opens, and I see the following in logs:

Trace: InternalServerErrorException: InvalidBrowserConnection
    at PrinterService.getBrowser (/app/dist/apps/server/main.js:13108:19)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async PrinterService.generateResume (/app/dist/apps/server/main.js:13150:29)
    at async /app/dist/apps/server/main.js:13120:25
    at async UtilsService.getCachedOrSet (/app/dist/apps/server/main.js:11886:23)
    at async ResumeService.printResume (/app/dist/apps/server/main.js:13965:21)
    at async ResumeController.printResume (/app/dist/apps/server/main.js:13580:25) {
  response: {
    message: 'InvalidBrowserConnection',
    error: 'connect ETIMEDOUT 192.168.0.3:8576',
    statusCode: 500
  },
  status: 500,
  options: {}
}
    at PrinterService.generateResume (/app/dist/apps/server/main.js:13226:21)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async /app/dist/apps/server/main.js:13120:25
    at async UtilsService.getCachedOrSet (/app/dist/apps/server/main.js:11886:23)
    at async ResumeService.printResume (/app/dist/apps/server/main.js:13965:21)
    at async ResumeController.printResume (/app/dist/apps/server/main.js:13580:25)

Expected Behavior

The resume should download as a PDF

Steps To Reproduce

Download/export the resume as a PDF

What browsers are you seeing the problem on?

Chrome

What template are you using?

None

Anything else?

My current compose.yaml:

version: "3.9"
services:
  postgres:
    image: postgres:15-alpine
    container_name: postgres_reactive-resume
    restart: unless-stopped
    volumes:
      - ./data:/var/lib/postgresql/data
    environment:
      POSTGRES_DB: postgres
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: ${POSTGRES_PASSWORD}
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U postgres -d postgres"]
      interval: 10s
      timeout: 5s
      retries: 5

  minio:
    image: minio/minio
    container_name: minio_reactive-resume
    restart: unless-stopped
    command: server /data
    ports:
      - 9000:9000
    volumes:
      - ./minio:/data
    environment:
      MINIO_ROOT_USER: ${STORAGE_ACCESS_KEY}
      MINIO_ROOT_PASSWORD: ${STORAGE_SECRET_KEY}

  chrome:
    image: browserless/chrome:1.61.0-puppeteer-21.4.1
    container_name: chrome_reactive-resume
    restart: unless-stopped
    ports:
      - 8576:3000
    environment:
      KEEP_ALIVE: true
      TOKEN: ${CHROME_TOKEN}
      EXIT_ON_HEALTH_FAILURE: true
      PRE_REQUEST_HEALTH_CHECK: true

  redis:
    image: redis:alpine
    container_name: redis_reactive-resume
    restart: unless-stopped
    command: redis-server --requirepass ${REDIS_PASSWORD}

  app:
    image: amruthpillai/reactive-resume:latest
    container_name: reactive-resume
    restart: unless-stopped
    ports:
      - 3000:3000
    depends_on:
      - postgres
      - minio
      - redis
      - chrome
    environment:
      PORT: 3000
      NODE_ENV: production
      PUBLIC_URL: http://192.168.0.3:3000
      STORAGE_URL: http://192.168.0.3:9000/default
      CHROME_PORT: 8576
      CHROME_TOKEN: ${CHROME_TOKEN}
      CHROME_URL: http://192.168.0.3:8576
      DATABASE_URL: postgresql://postgres:${POSTGRES_PASSWORD}@postgres:5432/postgres
      ACCESS_TOKEN_SECRET: ${ACCESS_TOKEN_SECRET}
      REFRESH_TOKEN_SECRET: ${REFRESH_TOKEN_SECRET}
      STORAGE_ENDPOINT: minio
      STORAGE_REGION: us-east-1
      STORAGE_PORT: 9000
      STORAGE_BUCKET: default
      STORAGE_ACCESS_KEY: ${STORAGE_ACCESS_KEY}
      STORAGE_SECRET_KEY: ${STORAGE_SECRET_KEY}
      STORAGE_USE_SSL: false
      REDIS_URL: redis://default:${REDIS_PASSWORD}@redis:6379
      VITE_DISABLE_SIGNUPS: true

[AmruthPillai]

CHROME_URL should be a websocket URL. I'm surprised the validation didn't catch the error. You should switch the http:// to ws://

As for the invalid browser connection, we can first debug if the chrome service is indeed working correctly. Check http://chrome-ip: port?token=your-chrome-token (and yes, here it is http, not ws) and see if the browserless debug page indeed opens up.

[thepaperpilot]

I'm having this issue as well (although I'm using ws:// in my docker-compose file), and I do see the browserless debug page when following your instructions.

I had to URI encode the token so I tried changing the token to one without special characters and that unfortunately didn't fix the issue.

Edit: Actually, I'd fat-fingered and written wss. Once I fixed it to ws it started working for me.

[mrodus]

@AmruthPillai I had it originally to ws, I only changed it to http while I was experimenting; must have forgotten to change it back. Even with ws, I am getting the same error. Setting the CONNECTION_TIMEOUT environment variable to 100000 didn't help either.

@thepaperpilot Could you share your compose file?

[thepaperpilot]

@thepaperpilot Could you share your compose file?

resume_db:
    image: postgres:15-alpine
    restart: always
    container_name: resume_db
    volumes:
      - resume_data:/var/lib/postgresql/data
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: ${RESUME_PASSWORD}
      POSTGRES_DB: postgres
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U postgres -d postgres"]
      interval: 10s
      timeout: 5s
      retries: 5
  chrome:
    image: browserless/chrome:1.61.0-puppeteer-21.4.1
    restart: always
    container_name: chrome
    environment:
      TOKEN: ${CHROME_TOKEN}
      EXIT_ON_HEALTH_FAILURE: true
      PRE_REQUEST_HEALTH_CHECK: true
    labels:
      - traefik.enable=true
      - traefik.http.routers.printer.rule=Host(`printer.incremental.social`)
      - traefik.http.routers.printer.entrypoints=websecure
      - traefik.http.routers.printer.tls.certresolver=myresolver
      - traefik.http.services.printer.loadbalancer.server.port=3000
  resume_redis:
    image: redis:alpine
    container_name: resume_redis
    command: redis-server --save 60 1 --loglevel warning --requirepass ${RESUME_PASSWORD}
    volumes:
      - resume_redis_data:/data
  reactive_resume:
    image: amruthpillai/reactive-resume:latest
    restart: always
    container_name: reactive_resume
    depends_on:
      - resume_db
      - chrome
      - resume_redis
    environment:
      PORT: 3000
      NODE_ENV: production
      PUBLIC_URL: https://resume.incremental.social
      STORAGE_URL: https://v4y3.c12.e2-2.dev/reactive-resume
      CHROME_TOKEN: ${CHROME_TOKEN}
      CHROME_URL: ws://printer.incremental.social
      DATABASE_URL: postgresql://postgres:${RESUME_PASSWORD}@resume_db/postgres
      ACCESS_TOKEN_SECRET: ${RESUME_ACCESS_TOKEN}
      REFRESH_TOKEN_SECRET: ${RESUME_REFRESH_TOKEN}
      MAIL_FROM: noreply@incremental.social
      #SMTP_URL: smtp://noreply:${NOREPLY_PASSWD}@incremental.social:587
      STORAGE_ENDPOINT: y0o9.tx21.idrivee2-4.com
      STORAGE_PORT: 443
      STORAGE_REGION: Dallas
      STORAGE_BUCKET: reactive-resume
      STORAGE_ACCESS_KEY: ${RESUME_ACCESS_KEY}
      STORAGE_SECRET_KEY: ${RESUME_SECRET_KEY}
      STORAGE_USE_SSL: true
      REDIS_URL: redis://default:${RESUME_PASSWORD}@resume_redis:6379
      VITE_DISABLE_SIGNUPS: true
    labels:
      - traefik.enable=true
      - traefik.http.routers.app.rule=Host(`resume.incremental.social`)
      - traefik.http.routers.app.entrypoints=websecure
      - traefik.http.routers.app.tls.certresolver=myresolver
      - traefik.http.services.app.loadbalancer.server.port=3000

[mrodus]

I figured it out. For someone reading it later, I had to allow the port I specified for the chrome app in my firewall.