How correctly call an websocket from FE using http1.1

Question

The backend engineer has implemented a websocket. I'm able to call it via CURL. As I understand this is not a websocket but an http1.1 layer, that is like a websocket and uses the same handshake.

In the curl I've hardcoded "Sec-WebSocket-Key" but when I call it via browser I understand the key generation is automatic?

curl -i -N --http1.1 \
-H "Connection: Upgrade" \
-H "Upgrade: websocket" \
-H "Host: be.domain.ai:8000/ws" \
-H "Origin: http://be.domain.ai:8000/ws/v0/data/$1" \
-H "Sec-WebSocket-Key: SGVsbG8sIHdvcmxkIQAAAA==" \
-H "Sec-WebSocket-Version: 13" \
http://be.domain.ai:8000/ws/v0/data/$1

The endpoint that I'm calling is a http://be... endpoint and not a ws://

I've tried calling via react like this

export const useWebSocket = (url) => {
  useEffect(() => {
    const socket = new WebSocket(url, [
      'websocket',
      'http/1.1',
      'Upgrade: websocket',
      'Connection: Upgrade',
      'Sec-WebSocket-Key: SGVsbG8sIHdvcmxkIQAAAA==',
      'Sec-WebSocket-Version: 13',
    ]);
    socket.addEventListener('open', (event) => {
      console.log('WebSocket connection is open');
    });

    socket.addEventListener('message', (event) => {
      console.log('Received message:', event.data);
    });

    socket.addEventListener('close', (event) => {
      console.log('WebSocket connection is closed:', event.code, event.reason);
    });

    socket.addEventListener('error', (event) => {
      console.error('WebSocket error:', event);
    });

    return () => {
      socket.close();
    };
  }, [url]);
};

But I get errors that 'http/1.1', 'Upgrade: websocket','Connection: Upgrade' are invalid.

I don't understand if I need to create other API layer with express for example and than have my browser call and express api ws endpoint that will forward the call the to the http1.1 endpoint as I can't seem to find a solution of how do I call this endpoint and get stream of data.

How correctly call an websocket from FE using http1.1

0 Answers0