タグ

webRTCに関するjetglassのブックマーク (31)

  • GitHub - shiguredo/momo: WebRTC Native Client Momo

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    GitHub - shiguredo/momo: WebRTC Native Client Momo
  • Private Home Surveillance with the WebRTC DataChannel (Ivelin Ivanov) - webrtcHacks

  • GitHub - webrtc/adapter: READ ONLY FORK: Shim to insulate apps from spec changes and prefix differences. Latest adapter.js release:

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    GitHub - webrtc/adapter: READ ONLY FORK: Shim to insulate apps from spec changes and prefix differences. Latest adapter.js release:
  • GitHub - jlaine/aiortc: WebRTC and ORTC implementation for Python using asyncio

    The main WebRTC and ORTC implementations are either built into web browsers, or come in the form of native code. While they are extensively battle tested, their internals are complex and they do not provide Python bindings. Furthermore they are tightly coupled to a media stack, making it hard to plug in audio or video processing algorithms. In contrast, the aiortc implementation is fairly simple a

    GitHub - jlaine/aiortc: WebRTC and ORTC implementation for Python using asyncio
  • WebRTC でビデオチャットアプリを作ってみた - Neo's World

    WebRTC でビデオチャットアプリを作ってみた リモート会議をやる機会が増えて、Google Meet、Microsoft Teams、Zoom などを利用している。ビデオチャットとか面白いなー、WebRTC とかいうヤツがあったと思うけど触ったことないなー、と思ったので、作ってみることにした。 目次 成果物とデモサイト 参考にした文献・コード WebRTC を始めるために理解すること WebRTC による双方向通信の仕組み WebSocket を利用したシグナリング処理 RTCPeerConnection シグナリングサーバの実装 クライアントの実装 つまづいたところ RTCPeerConnection の仕様 getUserMedia()・video 要素の扱い addStream() ではなく addTrack() 既知の不具合 以上 成果物とデモサイト 作成したコード全量は以下の

  • ReactNativeとSkyWayで始めるWebRTC - Qiita

    ネイティブアプリケーションを作る際に、ReactNativeはとても生産性が高く、好んで使っています。 また、SkyWayですが、WebRTCを使ったアプリケーションを作る際のプラットフォームとして、特に日では一定のコミュニティもありますし、良い選択肢だと思います。 SkyWayでは、iOS SDKとAndroid SDKが提供されているのですが、ReactNativeからそれらネイティブSDKを使おうとすると、JSとブリッジしてやる必要があります。 今回、ReactNativeからSkyWayをブリッジするネイティブモジュールを書いて公開した1ので、その紹介をかねて導入と簡単なサンプルコードを説明させてもらおうと思います。 react-native-skyway 以下は、iOSで説明していきますが、Androidにも対応することが可能です。 プロジェクトの作成 まずは、新しいプロジェク

    ReactNativeとSkyWayで始めるWebRTC - Qiita
  • WebRTC P2Pを使って2つのマシンを接続する

    WebRTC P2Pで2つのマシンを接続する方法です。 サンプルの環境は次のとおりです。 シグナリングサーバ、WebサーバーはNode.jsを使用 実行ブラウザはGoogle Chromeを使用 シグナリングサーバとWebサーバーは同一マシンに配置 まずは、Node.jsをインストールしてください。その後、任意のフォルダを作成し次のコマンドを実行します。 npm init 各項目は空白でも構いません。 また、こちらの記事を参考に、同フォルダ内に疑似のSSL証明書を作成してください。 Node.jsでHTTPSサーバーを起動する方法 シグナリングサーバを使って2つのデバイスを接続する P2P方式ではシグナリングサーバを使って2つのマシンを接続します。シグナリングサーバはお互いのIPアドレスやポート番号を解決するために必用となります。P2P通信なのに、サーバーレスとならないのはこのためです。

    WebRTC P2Pを使って2つのマシンを接続する
  • シグナリングサーバーを動かそう ーWebRTC入門2016

    こんにちは! 2014年に連載した「WebRTCを使ってみよう!」シリーズのアップデート記事も3回目となりました。今回は、前回の「手動」で行ったP2P通信の準備を、自動で行えるようにしてみましょう。 シグナリングサーバーを立てよう 前回は手動でコピー&ペーストを行い、WebRTCのP2P通信を始めるために次の情報を交換しました。 SDP ICE candidate 今回はこれを仲介するサーバー(シグナリングサーバー)を動かしてみましょう。方法として次の2つをご用意しました。 Node.jsを使ったシグナリングサーバー Chromeアプリ Node.jsを準備しよう まず、WebSocketを使ってシグナリングを行う方法をご紹介します。WebSocketの扱いやすさから、ここではNode.jsを使います。(もちろん他の言語を使っても同様にシグナリングサーバーを作ることができます)こちらの公式

    シグナリングサーバーを動かそう ーWebRTC入門2016
  • 仕事で WebRTC

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    仕事で WebRTC
  • スマホでの WebRTC の現状

    Safari 11 で WebRTC に対応した今、スマートフォン向けのネイティブアプリでの WebRTC はどうなるのかという相談をお客様から受けることが多い。 結論2017 年の 11 月、現時点ではスマートフォン向けの WebRTC アプリを作るべきで、スマートフォンのブラウザに期待してはいけない。 Safari はまだ課題は多く、AndroidChrome は思った以上に WebRTC が動作しない。 理由単刀直入に言えば、iOS の Safari や AndroidChrome で動かないという声がお客様から頂いているから。 Safari はコーデックが H.264 で固定されてしまうSafari はとりあえず対応したであり、不安要素は多くあるAndroidChrome では端末依存で VP8 や H.264 が動かない場合があるAndroidChrome

  • Web RTC JanusコンテナをDockerfileで作成 - Qiita

    Janusの動作確認 ブラウザからデモページ(http://127.0.0.1:8000/videoroomtest.html)にアクセスし、Janusのビデオルーム等が利用できることを確認する。 右上のSTARTボタンをクリックし、ルーム名を入力すると、ブラウザにパソコンのカメラ映像が表示されます。 DockerFile内容 # Base Image Debian FROM debian # OS Update RUN apt-get update # Required library installation RUN apt install libmicrohttpd-dev libjansson-dev libssl-dev \ libsofia-sip-ua-dev libglib2.0-dev libopus-dev libogg-dev \ libcurl4-openssl-d

    Web RTC JanusコンテナをDockerfileで作成 - Qiita
  • WebRTCゲートウェイ「Janus」を使ってみた - Qiita

    何をしたのか WebRTCゲートウェイ「Janus」をインストールし、サンプルを動かしてみました。 Janusとは Janus: the general purpose WebRTC Gateway 汎用WebRTCゲートウェイ ビデオ通話などの機能はプラグインとして提供されている SFU/MCUなどもプラグインとして提供されている。 早速インストール 実行環境 さくらのVPS CPU2コア メモリ1GB OS Ubuntu 16.04 LTS 依存パッケージをインストール $ sudo apt-get install libmicrohttpd-dev libjansson-dev libnice-dev \ libssl-dev libsrtp-dev libsofia-sip-ua-dev libglib2.0-dev libopus-dev \ libogg-dev libcurl

    WebRTCゲートウェイ「Janus」を使ってみた - Qiita
  • JavaScriptでWebRTCやるための基礎知識 - console.lealog();

    未来の自分のためのメモです。 仕事でやってないせいですぐ忘れるし、都度思い出すの大変なので・・。 ただまぁだいたいの人はSkyWayとかEasyRTCとか何かしらのライブラリを使うはずで、そういう人たちにはあまり関係ない内容かも。 生のjsでWebRTCを書くときに、先に知っておきたかった系のメモです。 素人ではないがベテランでもない、そんな微妙な知識レベルだと思います。 まだ枯れた仕様ではないので、記事を読む時は日付に注意してください... WebRTC is 何 WebでRealTimeCommunicationできる仕様 もといクライアントどうしでP2Pで通信できる仕様やそのAPI群 See WebRTC Home | WebRTC 仕様まわり WebRTC 1.0: Real-time Communication Between Browsers Identifiers for W

    JavaScriptでWebRTCやるための基礎知識 - console.lealog();
  • WebRTCでビデオ通話中に映像の解像度やフレームレートを動的に変更する方法 - Qiita

    はじめに WebブラウザでWebRTCによるビデオ通話を行う際は、getUserMediaで映像と音声を取得します。その際に、constraintsで制約条件を設定します。 この制約条件は一度設定したら変更出来ないと思っている方もいるかも知れませんが、実は柔軟に変更できるように、applyConstraintsというAPIが用意されています。このAPIを使うと、ビデオ通話中でも通話を途切れさせること無く映像や音声の制約条件を変更できます。例えば、通信状況が悪い時は解像度やフレームレートを小さく設定し、帯域を削減する等の機能を実装することが出来ます。 小ネタですが、便利なので紹介します。 applyConstraintsでconstraintsを柔軟に変更する getUserMediaで以下のようにconstraintsを指定してMediaStreamを取得します。 const localS

    WebRTCでビデオ通話中に映像の解像度やフレームレートを動的に変更する方法 - Qiita
  • WebRTC SFU Sora

    WebRTC による音声・映像・データのリアルタイムな配信と、その録音・録画を実現します お客様ご自身のサーバーにインストールしてご利用いただくパッケージソフトウェアです 株式会社時雨堂がフルスクラッチで開発しており、日語によるサポートとドキュメントを提供します 製品概要の続きを見る

  • SkyWay 配信者側で加工した映像を配信する - Qiita

    概要 弊社のインターンのお手伝いで、たまたまWebRTCを触る機会があったので、 気軽に加工した映像を配信したりできるのかなと思って試したので記します ※ 来なら、MCU ( Multipoint Control Unit )とかで映像加工するのかなと思うんですが、 今回は、インターン期間中に気軽に実装できそうなものくらいの感覚なので 配信者側(クライアント側)で映像を加工して配信する想定です。 題 今回は、SkyWay さんのサービスを利用します。(簡単にビデオ通話が実装できます) 結論から言うと、 カメラから取得した映像ストリームをCanvasに描画し、 Canvasで加工したものを再び映像ストリームとして取得したものを配信すれば可能 です。 なので、👇のように、白黒モザイク加工を施した上で、Websocketで受け取ったコメントを映像に載せて配信なんかもできます 簡易版として、

    SkyWay 配信者側で加工した映像を配信する - Qiita
  • iOSアプリでWebRTC - Qiita

    自己紹介 iOSアプリエンジニア iOSアプリ, Androidアプリ、web(java/ruby/php)を対応範囲広めにやっている感じ。 モチベーション 業務でWebRTCを使ったビデオ通話を実装することになった。 だが、Twilio Voideo SDK(サーバーも含めてのビデオ通話サービス)を使ったものだったため、WebRTCをちゃんとわからなくても、サンプルとGetStartedの通りにやれば実装できてしまった。 WebRTC自体、どういう感じで成り立っているのか知りたいと思い調べた。 WebRTCとは Wikipediaより ウェブブラウザやモバイルアプリケーションにシンプルなAPI経由でリアルタイム通信(英: real-time communication; RTC)を提供する自由かつオープンソースのプロジェクトである。ウェブページ内で直接のピア・ツー・ピア通信によって、プラ

    iOSアプリでWebRTC - Qiita
  • WebRTCのブラウザ対応状況の調べ方 - Qiita

    こんにちは、最近業務でWebRTCを勉強し始めたものです。 WebRTC使うぞ!となった時にまず気になるのが自分たちが対応したいブラウザでサポートされているのかという話なのですが、WebRTCはそれが単独のAPIで構成されているわけではなく、またコーデックなども関わってくるので、自信を持って大丈夫と言えるようにまとめてみました。 WebRTCのAPI まず WebRTC と一口に言っても window.webrtc みたいなオブジェクトが生えているわけではなく、ブラウザを介したユーザ間のリアルタイムコミュニケーションを実現するためのAPIの総称が WebRTC です。 それを実現するためには大きく二つあって 通信に使用するメディア(カメラやマイク)へのアクセス navigator.mediaDevices.getUserMedia() を使って MediaStreams を取得します。 P

    WebRTCのブラウザ対応状況の調べ方 - Qiita
  • WebRTCのリアルタイム音声合成サーバ(MCU)を作ってみた

    この他にもMCUで映像を合成する場合、映像のレイアウトに柔軟性がなく(出力が1つの映像となるため)、フロントエンド側からするとSFUのように個別の映像が貰えるほうが自由度が高くて嬉しいという観点もあります。 ただ、音声の場合、Web会議的なユースケースにおいてはレイアウトの概念がなくPCのスピーカーから出てくる頃にはMCUとSFUで音の違いはほとんどないでしょう。また、映像に比べると音声の合成はそれほどサーバへの負荷が高くありません。 音声にMCUを使う嬉しい点として、SFU経由だと多人数Web会議での通話が成り立たないほど回線が細い場合(移動通信回線の通信制限状態など)でもMCU経由だと通信量が抑えられるので通話できるかもしれないということが挙げられます。 そこで記事では比較的実用的と思われる音声のみを扱うMCUを実際に作ってみます。 MCUを作ってみよう ブラウザから複数の音源をMC

    WebRTCのリアルタイム音声合成サーバ(MCU)を作ってみた
  • react-native webrtc开发