Transporte Socket

Cuándo usar transporte socket

El transporte socket es útil cuando host y remoto no están en el mismo contexto de navegador y necesitas una frontera de red:

el runtime remoto se ejecuta en otro proceso o en otra máquina;
necesitas sesiones remotas activas para el desarrollo de extensiones;
quieres que clientes de debugging u observación se conecten de forma independiente.

Posicionamiento

@omnicajs/vue-remote mantiene la sincronización de render como un contrato de canal. El transporte socket es una elección de implementación para entregar ese contrato a través de la red.

Comparado con transporte iframe/worker, este modo añade responsabilidades operativas:

ciclo de vida de la sesión a través de reconexiones;
comprobaciones de auth y de capacidades;
orden de mensajes e idempotencia;
límites de payload y políticas de redacción.

Topología de alto nivel

Host Runtime
  -> createReceiver()
  -> createEndpoint(fromSocket(...))
  -> call.run(receiver.receive, hostBridge)

Socket Gateway
  -> session routing (host <-> remote)
  -> auth + protocol version checks

Remote Runtime
  -> createEndpoint(fromSocket(...))
  -> expose run/release

Wrapper mínimo de `MessageEndpoint` sobre WebSocket

@remote-ui/rpc funciona con objetos que implementan MessageEndpoint. Puedes adaptar WebSocket a esa forma:

import type { MessageEndpoint } from '@remote-ui/rpc'

export function fromSocket(socket: WebSocket): MessageEndpoint {
  const listeners = new Set<(event: MessageEvent) => void>()

  socket.addEventListener('message', (event) => {
    const message = JSON.parse(event.data as string)
    const wrapped = { data: message } as MessageEvent
    for (const listener of listeners) {
      listener(wrapped)
    }
  })

  return {
    postMessage(message: any) {
      socket.send(JSON.stringify(message))
    },
    addEventListener(event, listener) {
      if (event === 'message') {
        listeners.add(listener)
      }
    },
    removeEventListener(event, listener) {
      if (event === 'message') {
        listeners.delete(listener)
      }
    },
    terminate() {
      socket.close()
    },
  }
}

Después conecta los endpoints igual que en otros transportes:

const socket = new WebSocket('wss://runtime.example.com/remote-session?sessionId=abc')
const endpoint = createEndpoint<RemoteApi>(fromSocket(socket))

await endpoint.call.run(receiver.receive, hostBridge)

Notas para producción

Autentica cada sesión antes de run(...).
Versiona el protocolo y rechaza clientes incompatibles.
Aplica orden y correlation IDs a nivel del gateway.
Añade una política de reconexión con reglas explícitas de reanudación de sesión.
Aplica límites de tamaño del payload y redacción de campos sensibles.

Alcance recomendado

Buen encaje para plataformas de extensiones avanzadas y debugging remoto.
Excesivo para configuraciones básicas de host + extensión en una sola página.

Para configuraciones locales en navegador, prefiere primero Runtime de Web Worker o transporte iframe.