[vue] Failed to construct 'WebSocket'

 

 

다른 분이 퍼블해주신 파일을 git으로 받아 서버에 띄웠다..

 

그러니 갑자기 

빨간 화면으로 Failed to construct 'WebSocket' 하면서 실행이 안되는 거 실화?

 

일단 우선 급하게 검색을 해봤더니 https가 설정된 환경에서 안전하지 않은 ws 실행되었을 때 나오는 오류라고 한다

 

심지어 vue로 검색하면 안나오고 다들 react 환경만 검색이 된다,,

 

vue 도 좀 사랑해주세요..

 

엉엉..

그렇지만 꼭 올려야되는 파일이라서 검색의 검색,,

한 10분동안 검색만 하면서 찾아봤다

 

누군가가 이걸 본다면 꼭 10분 검색하지말고 제 걸 보고 해결하세요,,

 

 

우선 나는 vue-cli 환경이다

vue.config.js 가서 

기존에 있는 

module.exports = { 

devServer: 

 

}

 

에서

 

module.exports = { 

devServer: 

 { client: {

        webSocketURL: 'auto://0.0.0.0:0/w.

   .  }

   }

}

 

클라이언트 부분 추가 완료 짜잔

 

2. vite를 사용할 때는 vite.config.js 가서 

 

export default defineConfig({

 server: {

     }

   })

 

기존에 있던 저기에

export default defineConfig({

 server: {

     https: true,

        }

     })

 

이렇게 https 속성을 추가하거나

 

export default defineConfig({

 server: {

    webSocketServer: {

         options: {

             secure: true

              }

           } 

        }

     })

 

웹소켓서버 설정 넣어주기