広告
はじめに
以前、coincheckのAPIをPythonから利用して仮想通貨の取引レートを取得をやってみました。本当はJavascriptで取得したかったのですが、同一参照元がうんぬんの制約(あまり理解できてない)によりサーバー側でアクセス拒否されてしまうことが分かり断念しました。
調べていく内にどうやらWebSocketを使って取得する方法もあることを知り、coincheckはβ版ですがWebSocketに対応していたので勉強もかねてcoincheckで公開されているAPIを使ってビットコインの取引情報をリアルタイムで取得してみました。
WebSocketで取得した板情報(BTC/JPY)
bids
注文のレート, 注文量
asks
注文のレート, 注文量
ソースコード
あまり綺麗ではありませんが、下記のソースコードで実現しています。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 |
<html> <meta charset="UTF-8"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(function() { var webSocket = null; var bids_cnt = 0; var asks_cnt = 0; function open() { if (webSocket == null) { webSocket = new WebSocket("wss://ws-api.coincheck.com/"); // イベントハンドラの設定 webSocket.onopen = onOpen; webSocket.onmessage = onMessage; webSocket.onclose = onClose; webSocket.onerror = onError; } } // 接続イベント function onOpen(event) { // 板情報の購読開始 webSocket.send(JSON.stringify({type: "subscribe", channel: "btc_jpy-orderbook"})); } // メッセージ受信イベント function onMessage(event) { if (event && event.data) { // JSONデータに変換 var json = $.parseJSON(event.data); for (var i = 0; i < json[1].bids.length; i++) { $('#bids').append(json[1].bids[i][0] + ", " + json[1].bids[i][1] + "<br/>"); bids_cnt++; } for (var i = 0; i < json[1].asks.length; i++) { $('#asks').append(json[1].asks[i][0] + ", " + json[1].asks[i][1] + "<br/>"); asks_cnt++; } // 10行溜まったら一旦消去 if (bids_cnt > 10) { $('#bids').empty(); bids_cnt = 0; } if (asks_cnt > 10) { $('#asks').empty(); asks_cnt = 0; } } } // エラーイベント function onError(event) { console.log("エラーが発生しました。"); } // 切断イベント function onClose(event) { console.log("コネクションが切断しました。"); } window.addEventListener('load', open); }); </script> </head> <body> <div class="orderbook"> <p style="font-size: 80%;">bids<br /> 注文のレート, 注文量</p> <div id="bids" style="font-size: 80%;height: 250px;width:50%"> </div> <p style="font-size: 80%;">asks<br /> 注文のレート, 注文量</p> <div id="asks" style="font-size: 80%;height: 250px;width:50%"> </div> </div> </body> </html> |
このままだと表示がダサいのでデザインを改善して取引所風の表示にしたいですね。
広告
広告
