hi everyone,

i'm trying to get a next.js app deployed on amplify to work with a websocket server built with fastapi and uvicorn, hosted on an ec2 instance. i'm getting a 500 internal server error when connecting to the socket.io server from the frontend.

objective:
i’m trying to set up real-time communication between my next.js frontend and the socket.io server on ec2. the frontend works locally but fails when deployed on amplify.

frontend (next.js):

import { io } from "socket.io-client";

const socket = io("http://<ec2-public-ip>:3001");
socket.on("connect", () => {
  console.log("connected to socket server");
});

backend (fastapi + uvicorn):

from fastapi import FastAPI
import socketio

sio = socketio.AsyncServer(cors_allowed_origins='*')
app = FastAPI()
sio_app = socketio.ASGIApp(sio, app)

@sio.event
async def connect(sid, environ):
    print("client connected:", sid)

if __name__ == "__main__":
    import uvicorn
    uvicorn.run(sio_app, host="0.0.0.0", port=3001)

error logs:
- amplify console: 500 internal server error
- browser console: net::ERR_NAME_NOT_RESOLVED
- curl to the ec2 public ip and port gives resposne (works as expected correctly)

what i've tried:
- confirmed websocket server is running on ec2 with the following docker logs:

  INFO: Uvicorn running on http://0.0.0.0:3001 (Press CTRL+C to quit)
  

- reviewed amplify's build settings, environment variables, and domain settings.

questions:
- is the issue because port 3001 is not open in the security group?
- could it be a cors issue between amplify and ec2?
- do i need any other configurations in amplify for the socket.io connection?

any help would be greatly appreciated!