1. 개요
지인 부탁으로 방송 + 채팅을 동시에 할 수 없겠냐라는 문의를 받고 제작하게 되었다.
2. 소스
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
let list = [
{
id : ""
, name: ""
}
, {
id : ""
, name: ""
}
, {
id : ""
, name: ""
}
, {
id : ""
, name: ""
}
];
_.each(list, function(item, idx) {
let html = new Array();
let url = "https://www.twitch.tv/" + item.id;
html.push("<iframe src=\"https://player.twitch.tv/?channel=" + item.id + "&parent=[서비스도메인]\" height=\"600\" width=\"400\" allowfullscreen>");
html.push("</iframe>");
$("#container").prepend(html.join(''));
html = new Array();
html.push("<iframe id=\"twitch-chat-embed\" src=\"https://www.twitch.tv/embed/"+item.id+"/chat?parent=[서비스도메인]\" height=\"500\" width=\"350\"></iframe>");
html.push("</iframe>");
$("#container-chat").prepend(html.join(''));
});
});
</script>
</head>
<body>
<div id="container">
</div>
<div id="container-chat">
</div>
</body>
</html>
'Programming > 기본 (Baisc)' 카테고리의 다른 글
[NODEJS][NPM][YARN][WEBPACK] NodeJS Webpack + Haproxy + Apache Reverse Proxy 구성 (0) | 2022.07.19 |
---|---|
[개발][권한][메뉴] 권한 및 메뉴 개발 Tip (0) | 2022.07.18 |
Java Spring 에서 서버 재기동 및 원격 패치 (0) | 2022.05.14 |
[Protocol][SMTP] 메일 프로토콜 Telnet Command별 메시지 (0) | 2022.04.28 |
[티맥스][Tmax] 미들웨어(MIddleware) TMAX JEUS 프로세스 모니터링 (0) | 2022.04.25 |