Can't upgrade request to websocket

I want to use a websocket in one of my middlewares. But I keep getting an error saying I can't upgrade my connection:

[uncaught application error]: TypeError - Invalid Header: 'upgrade' header must contain 'websocket'

[uncaught application error]: TypeError - Invalid Header: 'upgrade' header must contain 'websocket'

I've googled this error but only find old results relating this error to the version of deno or oak lib where I run the latest deno (1.37.2) and oak (12.6.1).

import {Application,Router} from 'https://deno.land/x/oak@v12.6.1/mod.ts'

function RefreshMiddleware() {
  return async (ctx,next) => {
    console.log('url',ctx.request.url.href)
    if (ctx.request.url.href.endsWith("/refresh")) {
      console.log(ctx.isUpgradable);
      console.log(ctx.request.headers.get("connection"));
      const socket = ctx.upgrade()
    } else next()
  }
}

const app = new Application()
app.addEventListener("error", e => console.error(e.error))

// Logger
app.use(async (ctx, next) => {
  const start = Date.now()
  await next()
  console.log(`${ctx.request.method} ${ctx.request.url} - ${Date.now() - start}ms`)
})
app.use(RefreshMiddleware())
app.use((ctx) => {ctx.response.body = "Hello World!"})

await app.listen({port: 8000})

import {Application,Router} from 'https://deno.land/x/oak@v12.6.1/mod.ts'

function RefreshMiddleware() {
  return async (ctx,next) => {
    console.log('url',ctx.request.url.href)
    if (ctx.request.url.href.endsWith("/refresh")) {
      console.log(ctx.isUpgradable);
      console.log(ctx.request.headers.get("connection"));
      const socket = ctx.upgrade()
    } else next()
  }
}

const app = new Application()
app.addEventListener("error", e => console.error(e.error))

// Logger
app.use(async (ctx, next) => {
  const start = Date.now()
  await next()
  console.log(`${ctx.request.method} ${ctx.request.url} - ${Date.now() - start}ms`)
})
app.use(RefreshMiddleware())
app.use((ctx) => {ctx.response.body = "Hello World!"})

await app.listen({port: 8000})

9 Replies

Kofi GOLO•10mo ago

if (req.headers.get("upgrade") != "websocket") {
    return new Response(null, { status: 501 });
  }
  const { socket, response } = Deno.upgradeWebSocket(req);
  socket.addEventListener("open", () => {
    console.log("a client connected!");
  });
  socket.addEventListener("message", (event) => {
    if (event.data === "ping") {
      socket.send("pong");
    }
  });
  return response;

if (req.headers.get("upgrade") != "websocket") {
    return new Response(null, { status: 501 });
  }
  const { socket, response } = Deno.upgradeWebSocket(req);
  socket.addEventListener("open", () => {
    console.log("a client connected!");
  });
  socket.addEventListener("message", (event) => {
    if (event.data === "ping") {
      socket.send("pong");
    }
  });
  return response;

FjordWarden•10mo ago

Yes, that works but I'm trying to migrate to oak . I can't imagine what I am doing wrong as I am just following the documentation.

Kofi GOLO•10mo ago

You just said: that works Then: what I am doing wrong I'm confused

FjordWarden•10mo ago

I want to use oak

Kofi GOLO•10mo ago

Just use it, there no OAK way, or Fresh Way to use WebSocket, just the Deno way: https://discord.com/channels/684898665143206084/1166876166741819452/1166888108231512085

NDH•10mo ago

https://medium.com/deno-the-complete-reference/deno-websocket-server-in-oak-9fbb36f65f04 https://dev.to/franciscomendes10866/getting-started-with-websockets-in-deno-tutorial-and-examples-4e5i

FjordWarden•10mo ago

Look, for some reason I keep having issues just running the example code. if I run the example from the blog, I just added an explicit version number, it still doesn't work:

import { Application, Router } from "https://deno.land/x/oak@v12.6.1/mod.ts";
const app = new Application({ logErrors: false });
const router = new Router();
router.get("/wss", (ctx) => {
  if (!ctx.isUpgradable) {
    ctx.throw(501);
  }
  const ws = ctx.upgrade();
  ws.onopen = () => {
    console.log("Connected to client");
    ws.send("Hello from server!");
  };
  ws.onmessage = (m) => {
    console.log("Got message from client: ", m.data);
    ws.send(m.data);
    ws.close();
  };
  ws.onclose = () => console.log("Disconncted from client");
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen({ port: 8000 });

import { Application, Router } from "https://deno.land/x/oak@v12.6.1/mod.ts";
const app = new Application({ logErrors: false });
const router = new Router();
router.get("/wss", (ctx) => {
  if (!ctx.isUpgradable) {
    ctx.throw(501);
  }
  const ws = ctx.upgrade();
  ws.onopen = () => {
    console.log("Connected to client");
    ws.send("Hello from server!");
  };
  ws.onmessage = (m) => {
    console.log("Got message from client: ", m.data);
    ws.send(m.data);
    ws.close();
  };
  ws.onclose = () => console.log("Disconncted from client");
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen({ port: 8000 });

The code does not run past if (!ctx.isUpgradable) ...

NDH•10mo ago

This happens on server startup, or when a client connects?

FjordWarden•10mo ago

Oh, ok sorry I get it know, that error is normal if you don't connect with a websocket...