Content: Websocket error using alternative server framework

[mikeburgh]

Version

@nuxt/content: 1.3.2
nuxt: 2.12.2

Reproduction Link

https://github.com/mikeburgh/nuxt-hapi-content
Created with npx create-nuxt-app
-selecting hapi as the server framework
-then adding in the @nuxt/content module

Steps to reproduce

Clone repo
Run npm run dev
Browse to : http://localhost:3000

What is Expected?

No errors in the console

What is actually happening?

Console is showing an error

 ERROR  Cannot read property 'length' of undefined                                                                                                                                                                20:57:36

  at WebSocket.setSocket (node_modules/@nuxt/content/node_modules/ws/lib/websocket.js:165:14)
  at WebSocketServer.completeUpgrade (node_modules/@nuxt/content/node_modules/ws/lib/websocket-server.js:322:8)
  at WebSocketServer.handleUpgrade (node_modules/@nuxt/content/node_modules/ws/lib/websocket-server.js:245:10)
  at WS.handleUpgrade (node_modules/@nuxt/content/lib/ws.js:21:21)
  at WS.serve (node_modules/@nuxt/content/lib/ws.js:17:10)
  at node_modules/@nuxt/content/lib/middleware.js:11:15
  at call (node_modules/connect/index.js:239:7)
  at next (node_modules/connect/index.js:183:5)
  at next (node_modules/connect/index.js:161:14)
  at WebpackBundler.middleware (node_modules/@nuxt/webpack/dist/webpack.js:5410:5) (repeated 1 times)

The error seems to be caused by the serve method in @nuxt/content/lib/ws.js and happens with both Hapi and express frameworks.

serve (req) {
    this.handleUpgrade(req, req.socket, undefined)
  }

Changing the undefined to an empty array solves it, although not sure if head should actually be something ? Happy to send a PR if head just needs to be an empty array ?

[onmyflow]

I've got the same problem. Rendering the markup seems to work fine, but this error always occurs in the console...

[jbnv]

I'm getting this error in two separate Nuxt Content projects. Both use Express.

[madsh93]

Is this related to issues with $content and having to refresh before loading the markdown?

[madsh93]

I'm getting this error in two separate Nuxt Content projects. Both use Express.

I'm using express as well. Have you found a solution?

[Butochnikov]

I have a similar problem

 ERROR  Cannot read property 'toLowerCase' of undefined                   

  at WebSocketServer.handleUpgrade (node_modules/ws/lib/websocket-server.js:192:27)
  at WS.handleUpgrade (node_modules/@nuxt/content/lib/ws.js:21:21)
  at WS.serve (node_modules/@nuxt/content/lib/ws.js:17:10)
  at node_modules/@nuxt/content/lib/middleware.js:12:15
  at call (node_modules/connect/index.js:239:7)
  at next (node_modules/connect/index.js:183:5)
  at next (node_modules/connect/index.js:161:14)
  at WebpackBundler.middleware (node_modules/@nuxt/webpack/dist/webpack.js:5532:5)

[ToxicMushroom]

I have a similar problem

 ERROR  Cannot read property 'toLowerCase' of undefined                   

  at WebSocketServer.handleUpgrade (node_modules/ws/lib/websocket-server.js:192:27)
  at WS.handleUpgrade (node_modules/@nuxt/content/lib/ws.js:21:21)
  at WS.serve (node_modules/@nuxt/content/lib/ws.js:17:10)
  at node_modules/@nuxt/content/lib/middleware.js:12:15
  at call (node_modules/connect/index.js:239:7)
  at next (node_modules/connect/index.js:183:5)
  at next (node_modules/connect/index.js:161:14)
  at WebpackBundler.middleware (node_modules/@nuxt/webpack/dist/webpack.js:5532:5)

I'm having that issue without an alternative server framework. I'm using nuxt defaults

[joaquimds]

I _think_ I've managed to fix this error with the following:

import http from 'http'
import { loadNuxt, build } from 'nuxt'
import express from 'express'

const app = express()
const port = 3000
const isDev = process.env.NODE_ENV !== 'production'

export const listen = async () => {
  const nuxt = await loadNuxt(isDev ? 'dev' : 'start')
  app.use(nuxt.render)
  if (isDev) {
    build(nuxt)
  }
  const server = http.createServer(app)
  server.listen(port, '0.0.0.0', async () => {
    await nuxt.callHook('listen', server)
    // eslint-disable-next-line no-console
    console.log(`Server listening on port ${port} .`)
  })
}

[Khalphion]

I get exactly the same error as @Butochnikov with a fresh app and I haven't done more than using yarn create nuxt-app with SSR and Nuxt Content options selected.

I'm having the app running in a Docker container and behind a NGINX reverse proxy, not sure if this is related to the problem?

I have a similar problem

 ERROR  Cannot read property 'toLowerCase' of undefined                   

  at WebSocketServer.handleUpgrade (node_modules/ws/lib/websocket-server.js:192:27)
  at WS.handleUpgrade (node_modules/@nuxt/content/lib/ws.js:21:21)
  at WS.serve (node_modules/@nuxt/content/lib/ws.js:17:10)
  at node_modules/@nuxt/content/lib/middleware.js:12:15
  at call (node_modules/connect/index.js:239:7)
  at next (node_modules/connect/index.js:183:5)
  at next (node_modules/connect/index.js:161:14)
  at WebpackBundler.middleware (node_modules/@nuxt/webpack/dist/webpack.js:5532:5)

[fuxinko]

I had similar problem. I was running nuxt locally behind nginx reverse proxy and when I enabled websockets in nginx, problem disappeared. Maybe it will help somebody.

[ToxicMushroom]

I had similar problem. I was running nuxt locally behind nginx reverse proxy and when I enabled websockets in nginx, problem disappeared. Maybe it will help somebody.

Oh that sounds promising and maybe this was my issue, ill give it a try

[Atinux]

@mikeburgh the repo does not exists, anyone has a reproduction?

[mikeburgh]

@Atinux Sorry I removed it once the create-nuxt-app builder removed support for Hapi and other engines as it looked like the direction for nuxt we changing to not support external backends. (I ended up with Nuxt and express via serverMiddleware until functions arrives)

[Atinux]

This is the way to go indeed.
Anyway this issue should be fixed with #620