[2023/10/31 追記] WebRTCの新たなAPIであるRTPTransportが提案されている事により、本資料の結論には至らない可能性が出てきています。RTPTransportの詳細はこちら。 --- WebRTC Meetup Tokyo #24 2023/06/23 の資料 (一部更新) 2023年6月時点におけるWebRTCに関連する技術動向と未来予想 動画はこちら
この前ポジショントークしたらそれなりに反響があったので書いてみる。 これまでの人生を振り返ると毎年ラジオや電話や配信サービスを作っている気がするし、なんかそういう仕事が回ってくることが多い気がする。 最近自分なりに答えが出たかなと思ったことがあるので言語化してみようと思う。 OGP は Flux ぽい画像だ。 注意・免責事項 ここにあるソースコードは不完全です。これは私が元々手元で実験していたボイラープレートであるとはいえ、いろんな仕事で培ったノウハウ的なものも含まれているので、念には念を入れて意図的に要件が透けそうな箇所は削除しています。 その結果元々のボイラープレートと乖離してしまい、動作しないコードになっています。ただ概念を伝えるには十分なコードになっているはずなので、脳内補完してください。質問は Twitter のメンション、もしくは Issue でのみ受け付けます。 (完全版を書
この資料には宣伝が含まれます ライセンス Creative Commons — 表示 - 非営利 - 改変禁止 4.0 国際 — CC BY-NC-ND 4.0 内容 これから WebRTC を学ぶ人が何を学ぶべきで、何は学ばないべきなのかを書く。定期的に更新していく。 趣味で学びたい人はターゲットに入っていません、仕事で利用する場合のみがターゲット。 まとめ 急がば回れで、W3C の資料を理解できるまで読み込む。 下手にフレームワークに依存したりして簡単な仕組みを覚えてしまうと後からツライ。 Media Capture and Streams WebRTC 1.0: Real-Time Communication Between Browsers Identifiers for WebRTC's Statistics API 作って学ぶも良いが、まずは出てくる単語などの意味を理解できるの
こんにちは、テリーです。今回はいつも以上にニッチなお話です。カメラ画像処理アプリケーションは映像を取得したコンピュータ上で行うことが一般的です。それは映像を伝送する際の圧縮復元で画質が劣化してしまうことと、伝送先での映像のトランスコード処理の集中ですぐにCPUが逼迫することが容易に想定されるからです。そのため、低遅延映像伝送後の映像処理の開発事例はあまり取り上げられていません。カメラが接続されたコンピュータ上で自作プログラムが動かせないことがありますし、開発言語が違う場合もあるでしょう。そこで今回はリモートカメラの映像をWebRTCで送受信し、Pythonで画像処理を加えて送り返す、ライブトランスコーディングの開発方法を紹介したいと思います。 動作環境 本記事は以下のバージョンを用いて動作を確認しています。 MacBook Pro (16-inch, 2019) macOS Big Sur
ここ数ヶ月は自社製品向けの End to End (Media) Encryption の設計と実装をしています。年内での提供を目標として開発を進めてい見ていますが、色々感じることがあったので雑に書いていこうと思います。 前提自分は暗号やセキュリティの専門家ではない自社製品向けの E2EE は Signal や Google Duo が利用している実績のある仕組みを採用しているE2EE や暗号の専門家を招聘し、相談しながら開発している自分の E2EE に対する考え悪意あるサービス管理者からユーザを守るために存在する機能と考えています。 Signal プロトコルはよく考えられすぎているSignal が考えた Curve25519 (x25519/ed25519) を利用した X3DH / Double Ratchet の仕組みは安全すぎると感じるくらいです。 相手からメッセージを受信するたび
タップ・クリックするだけで他のデバイスと簡単にファイルを共有できるAirDropをJavaScriptだけで再現したその仕組みを紹介します。 同一WiFiで利用でき、iOSやmacOSだけでなく、AndroidやWindowsでもあらゆるファイルを簡単に共有できます。 How One Developer Recreated AirDrop Using Just JavaScript by Abdisalan 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 新しいテクノロジーの使用 これがないとWebRTCは使用できない どのようにデータを保護しているか? 使い慣れたUIとUX デバイスがWebRTCをサポートしていない場合はどうなりますか? イベント駆動型のコードスタイル 自身でコードを調べる 終わりに はじめに iP
こんにちは!CyberAgentでソフトウェアエンジニアを務めている松澤(@thmatuza)です。 この度サイバーエージェントグループでの技術カンファレンスCA BASE CAMPにて登壇させていただきました。WebRTCとコラボ配信についてお話ししました。 本記事では登壇内容を紹介します。 1.コラボ配信 コラボ配信は、近年様々なライブ配信サービスで実装されている機能で、離れた場所にいる2人以上の配信者がいっしょに配信する機能です。まずこの動画を見てください。 この動画は、ある配信アプリのテレビコマーシャルです。CM中で、人気の配信者が一人で配信を開始します。その配信を教室で見ていた学生さんが、「コラボする」というボタンをクリックすると、配信者へ通知が行き、配信者が承認すると、映像が分割され、人気配信者と視聴者がいっしょに生配信できるようになります。これがコラボ配信機能です。 コラボ配
TL;DR github.com やりたかったこと iOSのカメラを使う リアルタイムで送ってほしい 音声も拾いたい やったこと iOSのカメラを使う 音声も拾いたい MediaDevices.getUserMedia() - Web API | MDN を使った リアルタイムで送ってほしい webrtc.ecl.ntt.com を使った 公開するまでの流れ 最初はリアルタイムで配信すること & 音声の取得は難しいと思っていたので、 ブラウザで撮影したカメラの画像をサーバに送信する方法 - NaCl非公式ブログ とを参考にして、 Rails 5.2 + Stimulusjsで作っていた。 お世話になっていた FJORD BOOT CAMP(フィヨルドブートキャンプ) のシステムでも似たような実装があったのを記憶していたのでそのコード部分の実装*1*2 も参考にした。(余談だけどこの機能は今
追記) 【1000部を突破!】累計販売数1000部を超えました! ありがとうございます!!! 1.はじめに 以前Twitterで投稿し反響の大きかったweb会議システムを、より簡単な実装にしてこのチュートリアルでは解説したいと思います。私自身プログラミングを本格的に学び始めプログラミング歴1.5ヶ月で作る事が出来ました。初学者でも作れる内容になっています。 こちらが以前Twitterで投稿した内容です。 Web会議システムとはこのチュートリアルで作れる完成形のアプリがこちらです。 ビデオ通話、リアルタイムチャット、音声認識、自動文字起こしが出来るようになります。 *注意* 今回のチュートリアルは感情認識は含めておりません。感情認識の実装については公式ドキュメントの参照をお願いします。 このチュートリアルできるようになること・Web API を使ったマッシュアップアプリがつくれるようになる
こんにちわ、しいたけです。 今は夏休みで奥さんと子どもたちが帰省しているので、動物と2人で暮らしています。 で、外出すると動物だけを家に残していくことになります。 ペットモニターとか市販でもあるんですが、せっかくなので、 夏休みの自由研究として、ラズパイ+カメラモジュールとWebRTCを使って、外出先からでも動物の状態を確認できるやつを作ってみました。 ↑ 死活監視される動物の様子です 用意したもの Pi3 B+ スターターキット V3 16GB 白 Piカメラ Official V2 for 3/2/1/0 Manfrotto ミニ三脚 PIXI ブラック MTPIXI-B カメラ用 Manfrotto スマートフォン用三脚アダプター MCLAMP HAKUBA 自由雲台 BH-1 ラズパイ3とケースのセットとカメラモジュールは Raspberry Pi Shop by KSY で購入。
WebRTCのICEについて WebRTC Meetup Tokyo #8 で講演したスライドです。 口頭説明含めて確認したい方は、以下からご覧になれます。 https://youtu.be/6v4rvLiUCvM?t=47m17s その他誤記指摘等は、twitterの@iwashi86まで。
VoIP/WebRTC技術者のためのSTUN/TURN サーバー解説。その3. 「さくらのVPS」でつくるSTUN/TURN サーバー(セットアップ編)。 今回はSTUN/TURN サーバー解説の3回目です。前回(第2回)のインストール編は「TURNサーバー構築の目的」、「さくらVPSの紹介」、「事前のネットワーク設定」、「TURNサーバのオープンソフトウェアであるCOTURNのインストール」について説明しています。前回をまだ見てない方はそちらから見ることをオススメします。今回はCOTURNをインストールしていることを前提に、TURNサーバーをセットアップしていきます。また、前回同様、「さくらのVPS 」を利用して構築していきます。STUN/TURNについて、ぼんやりと知っているという方にはこの記事に沿って実際に構築してみることを今回も強くオススメします。実際に手を動かしてみると本当の理解
This document discusses WebRTC Native Client (WebRTC NaCl), which allows using the WebRTC API from native applications. It describes how WebRTC NaCl can be used to build native clients for WebRTC using C++ on Windows, macOS, Linux, iOS, and Android. It also summarizes the WebRTC Native Client project Momo, which provides a C++ library for building WebRTC applications that can run on devices like R
JavaScriptでWebRTCやるための基礎知識 - console.lealog(); 春なので書きました。 言うなれば、これの2019年度版です。 はじめに 最低限のJavaScriptでWebRTCを扱うにあたり、どういうクラスがあって、どういうAPIを、どう使うのかについての記事です。 いわゆるフロントエンドのエンジニアがWebRTCを使ったサービスを作るなどの場合は、だいたい何かしらのSDKを使うと思います。 その場合はそのSDKのDocsを読めばそれで十分で、その先の仕組みを知る必要はないかなーと思います。 ただし、 SDKの中で何が行われてるか知っておきたい WebRTCのSDKを作る側である みたいな場合は、一読の価値ありかもです。 ようするに、弊社の新入社員のような人材のための記事です! 基本的なWebRTCの仕組みみたいなパートはざっくり軽めにして、JavaScri
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く