watch config option : allow 0.0.0.0 mask

[augnustin]

Is your feature request related to a problem? Please describe

I'm using nuxt content in a docker. Hence the ws URL is not localhost:4000 but 172.19.0.2:4000, which I can't connect to if the websocket network mask is not set to 0.0.0.0.

Describe the solution you'd like

Add a ws.mask option in nuxt content config.

Describe alternatives you've considered

Having a ws.url = 172.19.0.2:4000 option would also work but would be less comfortable to use and less generic.

For now, I simply have to disable the watch option.

Cheers

[farnabaz]

Did you tried passing hostname to content.watch.ws options in nuxt.config?

Content Docs: https://content.nuxtjs.org/api/configuration#watch Listhen docs: https://github.com/unjs/listhen#hostname

[augnustin]

Thanks for your feedback.

I did not know about this listhen documentation. I guess it would be nice if it were mentioned in content doc.

I finally sorted myself out using:

// package.json
{
  scripts: {
    "dev": "HOSTNAME=$(hostname -i) && nuxt dev --port=5000",
  }
}

// nuxt.config.js
{
  content: {
    watch: {
      ws: {
        hostname: process.env.HOSTNAME,
      },
    },
  },
}

Slightly hacky solution, but it works :relaxed:

Should I close the issue?

[farnabaz]

You are right, sadly we didn't describe this in the content documentation yet. We should improve docs.

[PhE]

This issue is troublesome. We can't set reproductible dev environment with podman (or docker) since the websocket is not reachable !

@augnustin : your workaround implies a DNS entry on the client (and it triggers Chrome security that will probably prevent unsecured connection for non-localhost target)

The Content server is not consistent with Nuxt nor Vite :

• Nuxt server can be forwarded in podman/docker with a -p 3000:3000
• vite HMR server can be forwarded in podman/docker with a -p 24678:24678
• Content server can't be forwarded !

[Barbapapazes]

Hello, @danielroe, you do know if there is a way to re-use (or create a new one using Vite) the nuxt web socket connection? Currently, there is a custom (and manual) web socket connection created using web-socket.ts and in the module.ts. I'm clearly not an expert.

This manual connection is very annoying since we can't forward port (so no docker or docker tool based like code spaces and no remote dev) which is very annoying.

Thank you.

[Barbapapazes]

Ok, I understand how the handleHotUpdate from a Vite plugin work. Now, I need to understand how to tell to Vite to handle update on md files.

[Barbapapazes]

Ok, I understand how the handleHotUpdate from a Vite plugin work. Now, I need to understand how to tell to Vite to handle update on md files.

Maybe, it's not possible due to how it works but we can try using chokidar, like in Nuxt.

[Barbapapazes]

Ok, I understand how the handleHotUpdate from a Vite plugin work. Now, I need to understand how to tell to Vite to handle update on md files.

Maybe, it's not possible due to how it works but we can try using chokidar, like in Nuxt.

Ok, I've chokidar set up. The question is now, how to send ws event using vite?

[Barbapapazes]

Ok, I could have something.

EDIT:

 if (process.client && publicConfig.content.wsUrl) {
    // Connect to websocket
    // import('../composables/web-socket').then(({ useContentWebSocket }) => useContentWebSocket())
    if (import.meta.hot) {
      import.meta.hot.on('content:updated', () => {
        console.log('content updated !')
        refreshNuxtData()
      })
    }
  }

It seems cool!

[Barbapapazes]

I will try this setup in a Codespace.

[Barbapapazes]

But, how to have a working project in codespaces? mmmmh 🤔

[lkjimy]

This issue is troublesome. We can't set reproductible dev environment with podman (or docker) since the websocket is not reachable !

@augnustin : your workaround implies a DNS entry on the client (and it triggers Chrome security that will probably prevent unsecured connection for non-localhost target)

The Content server is not consistent with Nuxt nor Vite :

• Nuxt server can be forwarded in podman/docker with a -p 3000:3000
• vite HMR server can be forwarded in podman/docker with a -p 24678:24678
• Content server can't be forwarded !

Got the same issue. Content is unreachable to the frontend.

export default defineNuxtConfig({
  content: {
    watch: {
      ws: {
        hostname: process.env.CONTENT_HOST, // 0.0.0.0
        port: process.env.CONTENT_PORT, // 8000
        showURL: true
      }
    }
  }
})

I tried using 'localhost', '0.0.0.0', 'host.docker.internal'.

With 'host.docker.internal' I got this error:

With 'localhost' and '0.0.0.0' I got this: