Websocket Connection Failed. Encore Dev Server

[ghost]

Hello,

I got this error when starting Encore Dev Server. Actually it saying websocket connection to wss://localhost:8080/ws failed?

[Kocal]

Hi,

We can't help you so mush without context, what is your Encore configuration, do you run Encore outside or inside a virtual machine/Docker, etc...

Recently there are a lot of issues with the dev-server, please see #947, #951 and #948

[ghost]

Thanks @Kocal for replying. Below is taken from webpack.config.js. And no im not using virtual machine (yet) or anything similar.

Encore.setOutputPath('public/build/')
  .setPublicPath('/build')

  .addStyleEntry('styles', './assets/styles/app.scss')
  .addEntry('bootstrap', './assets/scripts/bootstrap.ts')
  .addEntry('quizzes', './assets/react/Quizzes/Quiz.tsx')

  .enableSassLoader()
  .enableTypeScriptLoader()
  .enableReactPreset()
  .enableSingleRuntimeChunk()
  .enableBuildNotifications(false)
  .enableSourceMaps(!Encore.isProduction())
  .enableVersioning(Encore.isProduction())
  .splitEntryChunks()
  .cleanupOutputBeforeBuild()
  .configureBabel(config => {
    config.plugins.push('@babel/plugin-proposal-class-properties')
    config.plugins.push('@babel/plugin-transform-spread')
    config.plugins.push('@babel/plugin-proposal-object-rest-spread')
    config.plugins.push('@babel/plugin-transform-arrow-functions')
  })
  .configureBabelPresetEnv(config => {
    config.useBuiltIns = 'usage'
    config.corejs = 3
  })
  .configureSplitChunks(chunk => {
    chunk.minSize = 150000
    chunk.maxSize = 350000
  })
  .configureFilenames({
    js: '[chunkhash].js',
    css: '[chunkhash].css',
  })
module.exports = Encore.getWebpackConfig()

[Kocal]

What version of Encore are you using and how do you run the dev-server ?

[ghost]

From package.json it was @symfony/webpack-encore": "^1.0.0. I run it with npm run dev-server and yarn dev-server to see if any differences. Thanks.

[Kocal]

Oh, I see you are running your site over HTTPS (https://localhost:8000) right?

It's written in your screenshot, the request to the dev-server http://localhost:8080 has been upgraded to HTTPS https://localhost:8080 due to mixed content issues:

But since you didn't configure the dev-server to work with HTTPS, it fails.

Please see https://symfony.com/doc/current/frontend/encore/dev-server.html#dev-server-options to learn how to configure HTTPS with the dev-server.

[ghost]

Ahhhh, my bad. Yes, it was fresh install of Symfony. And only with symfony serve. Thanks for pointing to the docs. How can i dont see that section lol. Let me try and report back. Thanks.

[ghost]

Well thats quick. Thank you very much @Kocal. Save my day!! I close the issue.

[Kocal]

No problem :)