[Node.js] 특정 홈페이지에서 크롬 개발자 도구의 Network 탭에 나오는 websocket의 데이터를 받는 프로그램 작성

조회수 2249회

안녕하세요.

현재 프로그램을 작성하다가 궁금증이 생겨서 이렇게 질문을 올립니다.

특정 홈페이지에서 크롬 개발자 도구 -> Network 탭에 가면 웹소켓에 관련된 내용이 나와서 이걸 Node.js로 받는 프로그램을 작성해보고 있습니다.

Header의 General 탭에
Request URL: wss://(url):(port)/socket.io/?streams=(streams)&EIO=(EIO)&transport=websocket&sid=(sid)
이렇게 나와있어 wss://(url):(port)/를 url 기준으로 삼고 프로그램을 작성하고 있습니다. 또한 Query String Parameters 탭에는 위에 괄호로 표현한
streams: (streams)
EIO: (EIO)
transport: websocket
sid: (sid)
값이 들어 있습니다.

아래는 제가 작성한 프로그램입니다.

const socket = require('socket.io-client');

let url = 'wss://(url):(port)';
let io = socket.connect(url);

io.on('connect',(err)=>{
    console.log('Connect!');
    io.send({
        query:{
            'path': '/socket.io',
            'streams': (streams),
            'EIO': (EIO),
            'transport': 'websocket',
            'sid': (sid)
        }
    });
});

io.on('error',(error)=>{
    console.log('err: ',error);
});

io.on('message',(data)=>{
    console.log(data);
});

웹소켓에서 message라는 내용이 Frames 탭에 쌓이는 것으로 보아 io.on('message')에 내용이 나올 것이라고 생각했는데 내용이 나오지 않고 계속 에러만 나옵니다.

아래는 에러 내용입니다.

err:  { Error: xhr post error
    at XHR.Transport.onError (G:\dev\js\bsx\node_modules\engine.io-client\lib\transport.js:64:13)
    at Request.<anonymous> (G:\dev\js\bsx\node_modules\engine.io-client\lib\transports\polling-xhr.js:109:10)
    at Request.Emitter.emit (G:\dev\js\bsx\node_modules\component-emitter\index.js:133:20)
    at Request.onError (G:\dev\js\bsx\node_modules\engine.io-client\lib\transports\polling-xhr.js:309:8)
    at Timeout._onTimeout (G:\dev\js\bsx\node_modules\engine.io-client\lib\transports\polling-xhr.js:256:18)
    at ontimeout (timers.js:498:11)
    at tryOnTimeout (timers.js:323:5)
    at Timer.listOnTimeout (timers.js:290:5) type: 'TransportError', description: 403 }

에러를 찾아보면 ajax, jquery에 관련된 내용만 나와서 잘 알 수가 없었습니다.

무엇이 잘못되었는지 알려주시면 정말 감사하겠습니다. ㅠㅠ

1 답변

  • 좋아요

    2

    싫어요
    채택 취소하기

    실제 테스트를 해 봐야 더 확실하겠지만,

    socket.io는 ws, wss 프로토콜을 바로 받아서 쓸 수 없는 상황이 있습니다.

    • Socket.io server - WebSocket client
    • WebSocket server - Socket.io client

    처럼 server - client 미스매칭시 연결이 이루어지지 않습니다.

    이는 공식 문서에 나와있는데요. 링크 페이지의 “What Socket.IO is not” 항목을 보시면 왜 그런지 이유를 설명하고 있습니다.

    추측입니다만 에러도 연결 타임아웃 때문에 발생한 것 같습니다.

    일단 브라우저에서 native feature로 지원하는 WebSocket 객체를 사용하셔야 연결이 가능할 듯 하네요.

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)