Integrating noVNC with Next.js

[Vivek Rathore]

I was trying to add a VNC client in my Next.js project using the library based on noVNC called 'novnc-core', but when I imported the RFB object from the library. I got the error "ReferenceError: window is not defined". I reckon this is due to ssr that next.js provide and noVNC uses window api which is browser specific. I searched about this error and tried multiple things like dynamic loading, "use-client" etc, but nothing is working for me. Is there any method or any other vnc client that uses websocket proxy?

```
import RFB from "novnc-core"
import { useEffect, useRef } from 'react';

const VNCViewer = () => {
    const vncContainerRef = useRef(null);
    const rfb = useRef(null);


    useEffect(() => {
        rfb.current = new RFB(vncContainerRef.current, "ws://url");
        rfb.current.connect();

        return () => {
            if (rfb.current) {
                rfb.current.disconnect();
                rfb.current = null;
               }
            }
    }, []);
   

    return <canvas ref={vncContainerRef}></canvas>;
};

export default VNCViewer;

```