web-dev-qa-db-fra.com

Comment utiliser le marionnettiste pour vider les données WebSocket

Je veux obtenir les données du Websocket sur cette page https://upbit.com/exchange?code=CRIX.UPBIT.KRW-BTC , son URL Websocket est dynamique et uniquement valide lors de la première connexion, le la deuxième fois que vous vous y connectez, il n'enverra plus de données.

enter image description here

Je me demande donc que peut-être sans tête chrome peut m'aider à surveiller les données du Websocket.

Des idées? Merci!

websocketpuppeteergoogle-chrome-headless
14
soulmachine

En fait, vous n'avez pas besoin de faire quoi que ce soit de complexe à ce sujet. L'URL semble cependant dynamique, mais fonctionne également bien avec le code. La raison pour laquelle cela ne fonctionne pas est que vous devez comprendre ce qui se passe en arrière-plan.

Examinons d'abord l'onglet Réseau.

Websocket URL

Les cookies et l'origine peuvent être importants pour la connexion. Nous les notons donc.

Voyons maintenant les échanges de données sur le socket

Starting frames

Middle frames

Si vous regardez les cadres, le cadre initial reçoit o comme données, ce qui peut indiquer une connexion d'ouverture. Et puis le site Web envoie des données au socket, qui peuvent être liées à ce que nous voulons interroger. Lorsque la connexion est interrompue pendant un certain temps, le socket reçoit h en tant que données. Cela peut indiquer une attente ou quelque chose (comme indiqué dans la deuxième image)

Pour obtenir les données exactes, nous mettons un point d'arrêt dans le code

Breakpoint

Et puis imprimez la valeur dans la console

data sent

Nous avons maintenant suffisamment d'informations pour accéder à la partie codage. J'ai trouvé ci-dessous une bonne bibliothèque websocket pour cela

https://github.com/websockets/ws

Nous faisons donc un

yarn add ws || npm install ws --save

Maintenant, nous écrivons notre code

const WebSocket = require("ws")
const ws = new WebSocket("wss://example.com/sockjs/299/enavklnl/websocket",null,{
    headers: {
        "Cookie":"<cookie data noted earlier>",
        "User-Agent": "<Your browser agent>"
    },
    Origin: "https://example.com",
})
const opening_message = '["[{\\"ticket\\":\\"ram macbook\\"},{\\"type\\":\\"recentCrix\\",\\"codes\\":[\\"CRIX.UPBIT.KRW-BTC\\",\\"CRIX.BITFINEX.USD-BTC\\",\\"CRIX.BITFLYER.JPY-BTC\\",\\"CRIX.OKCOIN.CNY-BTC\\",\\"CRIX.KRAKEN.EUR-BTC\\",\\"CRIX.UPBIT.KRW-DASH\\",\\"CRIX.UPBIT.KRW-ETH\\",\\"CRIX.UPBIT.KRW-NEO\\",\\"CRIX.UPBIT.KRW-BCC\\",\\"CRIX.UPBIT.KRW-MTL\\",\\"CRIX.UPBIT.KRW-LTC\\",\\"CRIX.UPBIT.KRW-STRAT\\",\\"CRIX.UPBIT.KRW-XRP\\",\\"CRIX.UPBIT.KRW-ETC\\",\\"CRIX.UPBIT.KRW-OMG\\",\\"CRIX.UPBIT.KRW-SNT\\",\\"CRIX.UPBIT.KRW-WAVES\\",\\"CRIX.UPBIT.KRW-PIVX\\",\\"CRIX.UPBIT.KRW-XEM\\",\\"CRIX.UPBIT.KRW-ZEC\\",\\"CRIX.UPBIT.KRW-XMR\\",\\"CRIX.UPBIT.KRW-QTUM\\",\\"CRIX.UPBIT.KRW-LSK\\",\\"CRIX.UPBIT.KRW-STEEM\\",\\"CRIX.UPBIT.KRW-XLM\\",\\"CRIX.UPBIT.KRW-ARDR\\",\\"CRIX.UPBIT.KRW-KMD\\",\\"CRIX.UPBIT.KRW-ARK\\",\\"CRIX.UPBIT.KRW-STORJ\\",\\"CRIX.UPBIT.KRW-GRS\\",\\"CRIX.UPBIT.KRW-VTC\\",\\"CRIX.UPBIT.KRW-REP\\",\\"CRIX.UPBIT.KRW-EMC2\\",\\"CRIX.UPBIT.KRW-ADA\\",\\"CRIX.UPBIT.KRW-SBD\\",\\"CRIX.UPBIT.KRW-TIX\\",\\"CRIX.UPBIT.KRW-POWR\\",\\"CRIX.UPBIT.KRW-MER\\",\\"CRIX.UPBIT.KRW-BTG\\",\\"CRIX.COINMARKETCAP.KRW-USDT\\"]},{\\"type\\":\\"crixTrade\\",\\"codes\\":[\\"CRIX.UPBIT.KRW-BTC\\"]},{\\"type\\":\\"crixOrderbook\\",\\"codes\\":[\\"CRIX.UPBIT.KRW-BTC\\"]}]"]'
ws.on('open', function open() {
    console.log("opened");
});

ws.on('message', function incoming(data) {
    if (data == "o" || data == "h") {
        console.log("sending opening message")
        ws.send(opening_message)
    }
    else {
        console.log("Received", data)

    }
});

Et exécuter le code que nous obtenons

Working code

Maintenant, si je remplace

const ws = new WebSocket("wss://example.com/sockjs/299/enavklnl/websocket",null,{
    headers: {
        "Cookie":"<cookie data noted earlier>",
        "User-Agent": "<Your browser agent>"
    },
    Origin: "https://example.com",
})

à

const ws = new WebSocket("wss://example.com/sockjs/299/enavklnl/websocket")

Ce qui signifie que cookies et Origin n'ont jamais été nécessaires en tant que tels. Mais je vous recommanderais quand même de les utiliser

21
Tarun Lalwani
const client = page._client

client.on('Network.webSocketCreated', ({requestId, url}) => {
  console.log('Network.webSocketCreated', requestId, url)
})

client.on('Network.webSocketClosed', ({requestId, timestamp}) => {
  console.log('Network.webSocketClosed', requestId, timestamp)
})

client.on('Network.webSocketFrameSent', ({requestId, timestamp, response}) => {
  console.log('Network.webSocketFrameSent', requestId, timestamp, response.payloadData)
})

client.on('Network.webSocketFrameReceived', ({requestId, timestamp, response}) => {
  console.log('Network.webSocketFrameReceived', requestId, timestamp, response.payloadData)
})

C'est en utilisant directement le protocole DevTools - https://chromedevtools.github.io/devtools-protocol/tot/Network#event-webSocketClosed

11
zag2art

Je ne pense pas que le marionnettiste ait encore pris en charge cela, mais le protocole de niveau inférieur le fait ici: https: //chromedevtools.github .io/devtools-protocol/tot/Network/# event-webSocketFrameSent et https://chromedevtools.github.io/devtools-protocol/tot/Network#type-WebSocketResponse . Cela signifie que vous pouvez l'implémenter vous-même dans une bibliothèque si vous le souhaitez.

3
browserless