Nuxt•3w ago

WebSocket connection to 'ws://localhost:24678/_nuxt/' failed

Hey, I've just restarted working on my side project. Started a project from scratch, didn't change anything, and as soon as I visit localhost:3000 I just get the same error over and over. I did it from scratch as I was having the same issue on an already existing project that I tried to upgrade to Nuxt latest version. Starting a new Nuxt 3 project in Stackblitz is also not working and I am wondering if these are related to each other (https://stackblitz.com/github/nuxt/starter/tree/v3) The errors I am getting in the browser console:

WebSocket connection to 'ws://localhost:24678/_nuxt/' failed: Could not connect to the server.

WebSocket connection to 'ws://localhost:24678/_nuxt/' failed: Could not connect to the server.

        
GET http://localhost:24678/_nuxt/ net::ERR_CONNECTION_REFUSED client.ts:339

        
GET http://localhost:24678/_nuxt/ net::ERR_CONNECTION_REFUSED client.ts:339

The piece of code in client.ts is:

  const ping = async () => {
    // A fetch on a websocket URL will return a successful promise with status 400,
    // but will reject a networking error.
    // When running on middleware mode, it returns status 426, and an cors error happens if mode is not no-cors
    try {
      await fetch(`${pingHostProtocol}://${hostAndPath}`, {
        mode: 'no-cors',
        headers: {
          // Custom headers won't be included in a request with no-cors so (ab)use one of the
          // safelisted headers to identify the ping request
          Accept: 'text/x-vite-ping',
        },
      })

  const ping = async () => {
    // A fetch on a websocket URL will return a successful promise with status 400,
    // but will reject a networking error.
    // When running on middleware mode, it returns status 426, and an cors error happens if mode is not no-cors
    try {
      await fetch(`${pingHostProtocol}://${hostAndPath}`, {
        mode: 'no-cors',
        headers: {
          // Custom headers won't be included in a request with no-cors so (ab)use one of the
          // safelisted headers to identify the ping request
          Accept: 'text/x-vite-ping',
        },
      })

StackBlitz

Nuxt - Starter - StackBlitz

Create a new Nuxt project, module, layer or start from a theme with our collection of starters.

2 Replies

brianb•3w ago

I cannot find anything about websockets or port 24678 in Nuxt 3 Docs.. Looks like it works on stackblitz if I use my own test repo. Thing is this happens locally but not on stackblitz. It didn't happen before and I am not aware of me changing anything regarding websockets / port 24678 I really need some help with this. I understand it is probably a vite issue, but I am expecting nuxt to work out of the box on macos.. It used to work before

Smef•3w ago

When I run dev on my machine I do see a WS connection, but it's port 3000. Is your app running on 24678? ws://localhost:3000/_nuxt/

Gaming

Programming

WebSocket connection to 'ws://localhost:24678/_nuxt/' failed