Connect user and server on custom patch ,socket.io Express

Question

I can not figure out how to connect the client to the server using sockets.

I use "nuxt": "^2.14.12", "socket.io": "^4.4.1", "vue-socket.io": "^3.0.10",

My client and server are on port 4500, but the server is prefixed with api . The server is on express and there are a lot of API routes, when I try to pass the api key to the sockets, I get the standard nuxt page that this route was not found.

1: https://i.stack.imgur.com/GkLsm.png 1

my front :

import Vue from "vue";
import VueSocketIO from "vue-socket.io";
import io from "socket.io-client";

const socketInstance = io("http://localhost:4500/", {
  rejectUnauthorized: true,
  path: "/api/",
  reconnection: true,
  reconnectionDelay: 1000,
  reconnectionDelayMax: 5000,
  reconnectionAttempts: 15,
});
export default ({ store }) => {
  Vue.use(
    new VueSocketIO({
      debug: true,
      connection: socketInstance,
      vuex: {
        store,
        actionPrefix: "SOCKET_",
        mutationPrefix: "SOCKET_",
      },
    })
  );
};

my server

const express = require("express");
const app = express();
const http = require("http");
const server = http.createServer(app);
const { Server } = require("socket.io");
const io = new Server(server);
io.on("connection", (socket) => {
  console.log("a user connected");
  socket.on("disconnect", () => {
    console.log("user disconnected");
  });
});

How can I connect client and server?