빗썸 비트코인 가격 웹소켓으로 실시간 가져오기
브라우저에서 직접 웹소켓 API를 직접호출하면 CORS(Cross-Orgin Resource Sharing) 크로스 도메인 정책 으로 오류가 발생할 수 있습니다.
그래서 public websocket API를 이용한 비트코인 실시간 가격 가져오는 예제 입니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>빗썸 비트코인 실시간 가격 정보</title>
<style>
body { font-family: Arial, sans-serif; text-align: center; }
h1 { font-size: 2rem; }
</style>
</head>
<body>
<h1>빗썸 비트코인 실시간 가격 정보</h1>
<p>현재 비트코인 가격: <span id="btc-price">가져오는 중...</span></p>
<script>
const websocket = new WebSocket('wss://pubwss.bithumb.com/pub/ws');
websocket.onopen = () => {
console.log('WebSocket connected');
websocket.send(JSON.stringify({
type: 'ticker',
symbols: ['BTC_KRW'],
tickTypes: ['1H']
}));
};
websocket.onmessage = (event) => {
const data = JSON.parse(event.data);
if (data.hasOwnProperty('content') && data.content.tickType === '1H') {
const btcPrice = data.content.closePrice;
document.getElementById('btc-price').textContent = btcPrice.toLocaleString() + ' KRW';
}
};
websocket.onclose = () => {
console.log('WebSocket disconnected');
};
websocket.onerror = (error) => {
console.error('WebSocket error:', error);
};
</script>
</body>
</html>
이 소스를 블로그나 게시글에 직접 게시하시면 가격 정보를 별다른 설정없이 실시간으로 표시하여 가져올 수 있습니다.
아래 실제 동작 화면 입니다. 조금만 응용 하시면 관심 종목의 코인 가격 정보를 실시간으로 보는 방법으로 쓸 수 있을것 같습니다.
빗썸 비트코인 실시간 가격 정보
현재 비트코인 가격: 가져오는 중...
감사합니다.
반응형
'개발' 카테고리의 다른 글
| [javascript/chatgpt] Chat GPT 도움받아 지렁이게임 만들기 (0) | 2023.03.28 |
|---|---|
| [javascript] 웹소켓 api를 이용한 빗썸 거래소 비트코인 실시간 체결량차트 (0) | 2023.03.23 |
| [javascript] HighChart를 이용한 트리맵 구현 (0) | 2023.03.19 |
| 구글서치콘솔 Indexing API 사용하여 페이지 색인 대량등록 (2) | 2023.03.18 |
| [javascript] 빗썸 비트코인 최근 100일 가격 가중치 구하기 (0) | 2023.03.17 |
