質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.47%
WebRTC

WebRTC(Web Real-Time Communication)とは、プラグイン無しでウェブブラウザ間の音声通話・ビデオチャットなどリアルタイムコミュニケーションができるオープンフレームワークです。W3CがAPIレベルで、IETFがプロトコルレベルでそれぞれ標準化が進められています。

Q&A

解決済

1回答

2498閲覧

skywayのチャット通信はDataChannelによるものなのか

退会済みユーザー

退会済みユーザー

総合スコア0

WebRTC

WebRTC(Web Real-Time Communication)とは、プラグイン無しでウェブブラウザ間の音声通話・ビデオチャットなどリアルタイムコミュニケーションができるオープンフレームワークです。W3CがAPIレベルで、IETFがプロトコルレベルでそれぞれ標準化が進められています。

0グッド

0クリップ

投稿2020/05/07 02:23

表題の通りskyway-javascriptSDKのサンプルのようなチャット通信はDataChannelによる実装なのかということです。
以下リンクのskyway通信要件ではUDPプロトコル、動的ポートでの通信ということになっています。
一般的にDataChannelはSCTPプロトコル上で動作するという認識でしたがこれは間違いでしょうか。
また、UDPであればskywayのSDKを使用している際のテキストデータ不着なども生じるのでしょうか?
ご教授いただければ幸いです。

https://support.skyway.io/hc/ja/articles/115002273767-SkyWay%E3%81%AE%E9%80%9A%E4%BF%A1%E8%A6%81%E4%BB%B6%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6

index.html

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>SkyWay - P2P Data example</title> <link rel="stylesheet" href="../_shared/style.css"> </head> <body> <div class="container"> <h1 class="heading">P2P Data example</h1> <p class="note"> Enter remote peer ID to connect. </p> <div class="p2p-data"> <div> <p>Your ID: <span id="js-local-id"></span></p> <input type="text" placeholder="Remote Peer ID" id="js-remote-id"> <button id="js-connect-trigger">Connect</button> <button id="js-close-trigger">Close</button> </div> <div> <pre class="messages" id="js-messages"></pre> <input type="text" id="js-local-text"> <button id="js-send-trigger">Send</button> </div> </div> <p class="meta" id="js-meta"></p> </div> <script src="//cdn.webrtc.ecl.ntt.com/skyway-latest.js"></script> <script src="../_shared/key.js"></script> <script src="./script.js"></script> </body> </html>

script.js

const Peer = window.Peer;

(async function main() {
const localId = document.getElementById('js-local-id');
const localText = document.getElementById('js-local-text');
const connectTrigger = document.getElementById('js-connect-trigger');
const closeTrigger = document.getElementById('js-close-trigger');
const sendTrigger = document.getElementById('js-send-trigger');
const remoteId = document.getElementById('js-remote-id');
const messages = document.getElementById('js-messages');
const meta = document.getElementById('js-meta');
const sdkSrc = document.querySelector('script[src*=skyway]');

meta.innerText = UA: ${navigator.userAgent} SDK: ${sdkSrc ? sdkSrc.src : 'unknown'} .trim();

const peer = (window.peer = new Peer({
key: xxx,
debug: 3,
}));

// Register connecter handler
connectTrigger.addEventListener('click', () => {
// Note that you need to ensure the peer has connected to signaling server
// before using methods of peer instance.
if (!peer.open) {
return;
}

const dataConnection = peer.connect(remoteId.value); dataConnection.once('open', async () => { messages.textContent += `=== DataConnection has been opened ===\n`; sendTrigger.addEventListener('click', onClickSend); }); dataConnection.on('data', data => { messages.textContent += `Remote: ${data}\n`; }); dataConnection.once('close', () => { messages.textContent += `=== DataConnection has been closed ===\n`; sendTrigger.removeEventListener('click', onClickSend); }); // Register closing handler closeTrigger.addEventListener('click', () => dataConnection.close(), { once: true, }); function onClickSend() { const data = localText.value; dataConnection.send(data); messages.textContent += `You: ${data}\n`; localText.value = ''; }

});

peer.once('open', id => (localId.textContent = id));

// Register connected peer handler
peer.on('connection', dataConnection => {
dataConnection.once('open', async () => {
messages.textContent += === DataConnection has been opened ===\n;

sendTrigger.addEventListener('click', onClickSend); }); dataConnection.on('data', data => { messages.textContent += `Remote: ${data}\n`; }); dataConnection.once('close', () => { messages.textContent += `=== DataConnection has been closed ===\n`; sendTrigger.removeEventListener('click', onClickSend); }); // Register closing handler closeTrigger.addEventListener('click', () => dataConnection.close(), { once: true, }); function onClickSend() { const data = localText.value; dataConnection.send(data); messages.textContent += `You: ${data}\n`; localText.value = ''; }

});

peer.on('error', console.error);
})();

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

https://webrtc.ecl.ntt.com/api-reference/javascript.html#methods-3
こちらを参照したところDataconnectionクラスを用いたものによるものということが判明いたしましたので恐らくDatachannelを使用した実装ということを把握いたしました。javascriptSDKのチュートリアルの確認しかしておらず確認不足でした。

投稿2020/06/03 06:44

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問