Deployment error about websocket

[picturesque-software]

hi! I am trying to deploy this project in Ubuntu 22.04. Firstly, I used 'ws://localhost:8000' as origin docker-compose file. But the websocket not connected. I found that in container the localhost can't access server outside. Then I used ws://backend:8000, the server name to access. The http request by http://backend:8000/ worked BUT the websocket by ws://backend:8000 is not connected.

here is my docker-compose file:

version: '3.8'

services:
  db:
    build:
      context: .
      dockerfile: Dockerfile.postgres
    restart: always
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
      PGDATA: /var/lib/postgresql/data/futurepreppers
    ports:
      - '5432:5432'
    volumes:
      - db:/var/lib/postgresql/data
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U postgres"]
      interval: 10s
      timeout: 5s
      retries: 5

  backend:
    build: 
      context: .
      dockerfile: Dockerfile
    ports:
      - "8000:8000"
    hostname: backend
    depends_on:
      db:
        condition: service_healthy
    env_file:
      - ./.env
    environment:
      - DATABASE_URL=postgresql://postgres:postgres@db:5432/postgres
    healthcheck:
      test: ["CMD", "curl", "-f", "http://localhost:8000/status"]
      interval: 10s
      timeout: 5s
      retries: 5

  web:
    build:
      context: ./client/next-web/
      dockerfile: Dockerfile
      args:
        NEXT_PUBLIC_FIREBASE_API_KEY: AIzaSyAVqhwbdB8I56HAMVVlgJKZcfrBkKI2AhQ
        NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: assistly-kubernetes.firebaseapp.com
        NEXT_PUBLIC_FIREBASE_PROJECT_ID: assistly-kubernetes
        NEXT_PUBLIC_FIREBASE_APP_ID: 1:806733379891:web:48bf124c0d9b90298e6646
        REACT_APP_BUILD_NUMBER: 0.0.1
        NEXT_PUBLIC_API_HOST: http://backend:8000
        API_HOST: http://backend:8000
    ports:
      - "3000:3000"
    links:
      - backend
    depends_on:
      backend:
        condition: service_healthy
      db:
        condition: service_healthy
    environment:
      - NEXT_PUBLIC_FIREBASE_API_KEY=AIzaSyAVqhwbdB8I56HAMVVlgJKZcfrBkKI2AhQ
      - NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=assistly-kubernetes.firebaseapp.com
      - NEXT_PUBLIC_FIREBASE_PROJECT_ID=assistly-kubernetes
      - NEXT_PUBLIC_FIREBASE_APP_ID=1:806733379891:web:48bf124c0d9b90298e6646
      - REACT_APP_BUILD_NUMBER=0.0.1
      - NEXT_PUBLIC_API_HOST=http://backend:8000
      - API_HOST=http://backend:8000

networks:
  default:
    driver: bridge

volumes:
  db:
    driver: local

My browser error:

It looks very strange.

Could you tell me how you deploy the project to connect websocket please? @pycui @y1guo @Shaunwei What is the correct ws address?

Any info is helpful! Thanks for any rely. Sincerely.

[picturesque-software]

I have chosen other docker network to deploy it. I could show my method here:

As mentioned above, my frontend docker container can't connect websocket with the backend docker container but the http connection does well.

Instead, I used host network on the frontend and backend container. And then I used nginx to proxy the websocket and the frontend page. The nginx config is following:

# 非强制重定向https
server {
    listen 443 ssl; #侦听443端口，用于SSL
    server_name YOUR_SERVERNAME;  # 自己的域名
    ssl_certificate /etc/nginx/cert/XXX.pem;
    ssl_certificate_key /etc/nginx/cert/XXX.key;

    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;

    location / {
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_pass http://127.0.0.1:3000;
    }
    location /ws/ {
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_pass http://127.0.0.1:8000;
    }
}

BUT I still think it is not elegant. I don't know why I could not access the bakend by websocket but I could access the backend by http when using the same host: http://backend:8000.

If someone could offer more info about deployment, I would pretty appreciate.