does kamal support websockets/socket.io?

[Cytla24]

hello,

i deployed a next.js application via kamal to a digital ocean droplet. everything works fine, except the application fails to establish a websocket connection - 308, then 404 status. I looked through kamal-proxy docs, because i wasn't sure if it supported socket.io, but i found nothing.

I also tried adding traefik as an accessory, so maybe it could handle it but no luck. any thoughts?

this is my deploy.yaml

<%
require "dotenv"
Dotenv.load(".env.local")
%>

# Name of your application. Used to uniquely configure containers.
service: turtlevsrabbit

# Name of the container image.
image: ojuba2013/turtlevsrabbit

# Deploy to these servers.
servers:
    web:
        - 157.230.189.61
    # job:
    #   hosts:
    #     - 192.168.0.1
    #   cmd: bin/jobs

# Enable SSL auto certification via Let's Encrypt (and allow for multiple apps on one server).
# If using something like Cloudflare, it is recommended to set encryption mode
# in Cloudflare's SSL/TLS setting to "Full" to enable end-to-end encryption.
proxy:
    ssl: true
    host: turtlevsrabbit.com
    healthcheck:
        path: /
        interval: 3
        timeout: 3
    # kamal-proxy connects to your container over port 80, use `app_port` to specify a different port.
    app_port: 3000

# Credentials for your image host.
registry:
    # Specify the registry server, if you're not using Docker Hub
    # server: registry.digitalocean.com / ghcr.io / ...
    username: ojuba2013

    # Always use an access token rather than real password (pulled from .kamal/secrets).
    password:
        - KAMAL_REGISTRY_PASSWORD

    server: registry.hub.docker.com

# Configure builder setup.
builder:
    arch: amd64
    context: .
    secrets:
        - NEXT_PUBLIC_SUPABASE_URL
        - NEXT_PUBLIC_SUPABASE_ANON_KEY
        - SUPABASE_SERVICE_ROLE_KEY
        - STRIPE_PUBLIC_KEY
        - STRIPE_SECRET_KEY
        - STRIPE_WEBHOOK_SECRET
        - EMAIL_SERVER
        - MAILGUN_API_KEY
        - NEXT_PUBLIC_SOCKET_URL
        - NODE_ENV
# Inject ENV variables into containers (secrets come from .kamal/secrets).
#
env:
    clear:
        PORT: 3000
        NODE_ENV: production
        NEXT_PUBLIC_SOCKET_URL: https://turtlevsrabbit.com
        NEXT_PUBLIC_SITE_URL: https://turtlevsrabbit.com
    #     DB_HOST: 192.168.0.2
    secret:
        - NEXT_PUBLIC_SUPABASE_URL
        - NEXT_PUBLIC_SUPABASE_ANON_KEY
        - SUPABASE_SERVICE_ROLE_KEY
        - STRIPE_PUBLIC_KEY
        - STRIPE_SECRET_KEY
        - STRIPE_WEBHOOK_SECRET
        - EMAIL_SERVER
        - MAILGUN_API_KEY
# Aliases are triggered with "bin/kamal <alias>". You can overwrite arguments on invocation:
# "bin/kamal logs -r job" will tail logs from the first server in the job section.
#
# aliases:
#   shell: app exec --interactive --reuse "bash"

# Use a different ssh user than root
#
# ssh:
#     user: app
# Use a persistent storage volume.
#
# volumes:
#   - "app_storage:/app/storage"

# Bridge fingerprinted assets, like JS and CSS, between versions to avoid
# hitting 404 on in-flight requests. Combines all files from new and old
# version inside the asset_path.
#
# asset_path: /app/public/assets

# Configure rolling deploys by setting a wait time between batches of restarts.
#
# boot:
#   limit: 10 # Can also specify as a percentage of total hosts, such as "25%"
#   wait: 2

# Use accessory services (secrets come from .kamal/secrets).
#
# accessories:
#   db:
#     image: mysql:8.0
#     host: 192.168.0.2
#     port: 3306
#     env:
#       clear:
#         MYSQL_ROOT_HOST: '%'
#       secret:
#         - MYSQL_ROOT_PASSWORD
#     files:
#       - config/mysql/production.cnf:/etc/mysql/my.cnf
#       - db/production.sql:/docker-entrypoint-initdb.d/setup.sql
#     directories:
#       - data:/var/lib/mysql
#   redis:
#     image: redis:7.0
#     host: 192.168.0.2
#     port: 6379
#     directories:
#       - data:/data
accessories:
  traefik:
    image: traefik:v2.10
    port: 8080
    cmd: >
      --providers.docker
      --entrypoints.web.address=:8080
      --entrypoints.websecure.address=:8443
      --certificatesresolvers.myresolver.acme.httpchallenge=true
      --certificatesresolvers.myresolver.acme.httpchallenge.entrypoint=web
      --certificatesresolvers.myresolver.acme.email=your@email.com
      --certificatesresolvers.myresolver.acme.storage=/letsencrypt/acme.json
    options:
      volume:
        - "/var/run/docker.sock:/var/run/docker.sock"
        - "letsencrypt:/letsencrypt"
      publish:
        - "8443:8443"
    roles:
      - web

labels:
  traefik.http.routers.turtlevsrabbit.rule: "Host(`turtlevsrabbit.com`)"
  traefik.http.routers.turtlevsrabbit.entrypoints: "websecure"
  traefik.http.routers.turtlevsrabbit.tls.certresolver: "myresolver"
  traefik.http.services.turtlevsrabbit.loadbalancer.server.port: "3000"
  traefik.http.middlewares.sio.headers.customrequestheaders.X-Forwarded-Proto: "https"
  traefik.http.routers.turtlevsrabbit.middlewares: "sio@docker"

[tuladhar]

Yes, Kamal supports WebSocket. Also, any reason why you are on Kamal v1 instead of Kamal v2 which replaced traefix with kamal-proxy.

[Cytla24]

im on kamal v2. the traefik configs are because websockets was working locally, but not on server. it fails with error Failed to load resource: the server responded with a status of 404 ().

when i run kamal proxy logs i could see the redirects and failures, 308 , 404

{"time":"2024-11-15T14:11:05.881337591Z","level":"INFO","msg":"Request","host":"turtlevsrabbit.com","port":443,"path":"/socket.io/","request_id":"fb19601a-d424-42ac-bb84-2326fb3a1f5e","status":308,"service":"turtlevsrabbit-web","target":"a2daf34354aa:3000","duration":170210638,"method":"GET","req_content_length":0,"req_content_type":"","resp_content_length":44,"resp_content_type":"","client_addr":"108.21.211.20","client_port":"54920","remote_addr":"108.21.211.20","user_agent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.6 Safari/605.1.15","proto":"HTTP/2.0","scheme":"https","query":"EIO=4&transport=polling&t=PCmASh_","req_cache_control":"","req_last_modified":"","req_user_agent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.6 Safari/605.1.15"}
2024-11-15T14:11:09.288746156Z {"time":"2024-11-15T14:11:09.263857279Z","level":"INFO","msg":"Request","host":"turtlevsrabbit.com","port":443,"path":"/socket.io","request_id":"dd38a098-5c8b-4564-aff0-17bd4e278241","status":404,"service":"turtlevsrabbit-web","target":"a2daf34354aa:3000","duration":3337920089,"method":"GET","req_content_length":0,"req_content_type":"","resp_content_length":26751,"resp_content_type":"text/html; charset=utf-8","client_addr":"108.21.211.20","client_port":"54920","remote_addr":"108.21.211.20","user_agent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.6 Safari/605.1.15","proto":"HTTP/2.0","scheme":"https","query":"EIO=4&transport=polling&t=PCmASh_","req_cache_control":"","req_last_modified":"","req_user_agent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.6 Safari/605.1.15"}

I thought it was a proxy issue, so i tried to add traefik as an accessory, because traefik supports websockets but that also didn't work. https://kamal-deploy.org/docs/upgrading/continuing-to-use-traefik/

[neonwatty]

Is there a simple example anywhere showing how to forward traffic from 443 to a websocket server running on a different port (on a non-proxy container) with kamal 2?

For example in my case my app container has a websocket running on port 27960.

Is there an analgous argument to app_port for proxy?

[Cytla24]

not been able to find an example anywhere. kamal proxy has all set of arguments https://kamal-deploy.org/docs/configuration/proxy/

it makes sense there are no exaamples because kamal proxy is still new, so only luck is this github thread. maybe someone from kamal may see it.

[neonwatty]

Yes - only see app_port arg here.

[Cytla24]

I can now confirm that kamal 2 supports websocokets. After bunch of debugging, it works. issue was with dockerfile :/ not Kamal.

[neonwatty]

Can you share more details?

What about the Dockerfile in your case turned out to be the issue?

Did you designate your websocket connection in a kamal config as well? If so, what did that look like? I only see app_port as an option for the proxy.

[tuladhar]

I can now confirm that kamal 2 supports websocokets. After bunch of debugging, it works. issue was with dockerfile :/ not Kamal.

Nice! Glad it worked out. Please do share your findings, if it's something worth sharing.

[neonwatty]

@Cytla24 can you share details here?

[Cytla24]

yes, sorry i took so long, i was on vacation.

To get it to work, i ran my websocket and main application on the same underlying HTTP server, and set it to run on port 3000. Then in my config.yaml file, i set app_port to 3000, and it worked.

The main issue that was breaking my config was the last line of my dockerfile. i had to change it to run the new server websocket server.mjs file, instead of the default one. Im running a next js application via docker, so basically changed CMD ["node", "default_server.js"], to CMD ["node", "new_custom_server.mjs"]

hope this helps

[neonwatty]

Thanks! Very helpful.