Capture audio and video in HTML5 | Articles | web.dev
Capture audio and video in HTML5 Stay organized with collections Save and categorize content based on your preferences. Introduction Audio/Video capture has been the "Holy Grail" of web development for a long time. For many years we've had to rely on browser plugins (Flash or Silverlight) to get the job done. Come on! HTML5 to the rescue. It might not be apparent, but the rise of HTML5 has brought
ycapture で OpenCV での処理結果を Windows のビデオソースとしてブラウザに流し込む - 自習室
はじめに WebRTC を使ってビデオチャットアプリを作る際に、ビデオ画像にエフェクトをかけたくなりました。モザイクとか、ブラーとか、漫画カメラとか。 ブラウザ上でJavaScriptでごりごり画像処理をするのはさすがに厳しそうですので、画像処理を行うのは別のアプリケーションで行うことにしました。 最終的に WebRTC で MediaStream として扱うことを考えると、画像処理の結果が通常のWebカメラと同様に navigator.getUserMedia() できれば一番手っ取り早いんじゃないかなーと思っていろいろ手法を探してみました。 便利なソフトを教えていただいた しかし調べれば調べるほど、Windows上だと DirectShowのお勉強しなきゃとかつらそうな気配が漂っていたのですが、Twitterに泣きついたところ、@jnakano さんが ycapture(わいきゃぷちゃ
WebRTC getUserMediaを使ってみる(1) - taock'sサイト
こんばんは、taockです。 最近、HTML5で簡単アプリを作ることが多くなってきたので、面白いものを紹介いこうと思います。 にしても、HTML5によるイノベーションでこれからIT系会社の人員配置、スキルも破壊的に変わってくるのでしょうね。これからも変化だらけの楽しい業界です（Web系から、組み込み系に転職した私はどうなることやらｗｗ） はじめに - HTML5とは - 今までのブラウザでは出来なかったことが、最近のブラウザでは出来るようになってきました。それを可能にする「ブラウザの新しいルール(規格)」がHTML5です。(少し正確に言うと、ここで言うHTML5は、HTML5 + CSS3 + JavaScript APIです。) ただ、新しいルールなので、ブラウザによっては動かなかったり、ルールが変更になり少し前の記事の情報では動かないといったことも起こります。 最近は、まだマシになって
WebRTC getUserMedia 簡単Webカメラ - jsdo.it - Share JavaScript, HTML5 and CSS
2013/11/25 taock WebRTCのgetUserMediaを利用して、カメラ、マイクの動画、音声を取得するサンプルです。 canvasに動画キャプチャを表示する機能が付いています。 //APIを格納 navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; //window.URLのAPIをすべてwindow.URLに統一 window.URL = window.URL || window.webkitURL; if (!navigator.getUserMedia) { alert("カメラ未対応のブラウザです。"); } // 変数 var canvas =
【スマホ×HTML5】Web&ハイブリッドアプリ開発者ブログ
【スマホ×HTML5】Web&ハイブリッドアプリ開発者ブログ このブログでは、HTML5+CSS3+Javascriptなどの情報を定期的に提供していきます。 運営企業：株式会社ニーロク（http://i26.jp/）
レガシーなWebブラウザにもgetUserMediaを·getUserMedia.js MOONGIFT
getUserMedia.jsはFlashを使うことでレガシーなWebブラウザでもgetUserMediaライクなWebカムアクセスを実現するJavaScriptライブラリです。 HTML5の新しいAPIの一つにWebカムアクセスがあります。そんなWebカムアクセスをレガシなーWebブラウザを含めて使えるようにしてくれるのがgetUserMedia.jsです。 最初です。カメラへのアクセスが求められます。 まずはWebカムの映像を画像として保存します。 さらに顔を認識して鼻眼鏡をつけるアクションです。 getUserMedia.jsではWebRTCに対応している場合はHTML5のgetUserMediaを使い、それ以外の場合はFlashベースのWebカムアクセスを使います。結果は同じように扱えるので、安心してWebカムアクセスできるようになるでしょう。 getUserMedia.jsはJa
getUserMedia が実装されました！
原文: getUserMedia is ready to roll! (on July 13, 2012 by Anant Narayanan) 今年の 4 月に、私たちは WebRTC 活動 についての記事 (和訳) を投稿しましたが、今日はエキサイティングな最新情報をお届けします。getUserMedia が mozilla-central にコミットされました！ この API は、Firefox の最新の Nightly バージョンで使えるようになったので、最終的にリリースビルドでも使えるようになります。 getUserMedia は、Web ページが動画や音声の入力を取得できるようにする DOM API です。つまり、Web カメラやマイクからの入力したデータを Web ページが扱えるようになります。私たちは、これが Web ページとアプリケーションの全く新たな可能性の扉を開くこと
[HTML5]getUserMedia APIを使ってカメラを表示させてみる – o24ブログ
本日Chromeのバージョン21がリリースされ、getUserMediaが実装されたようです。 getUserMediaを使うと、javascriptを使ってカメラにアクセスできるようなので、やってみました。 参考にしたページは以下 getUserMedia API <body> <video autoplay width="640" height="480"></video> <img src="" width="640" height="480" > <canvas style="display:none;" width="640" height="480"></canvas> <div id="wrapper"> <button id="capture">capture</button> <button id="stop">stop</button> </div> </body> <
![[HTML5]getUserMedia APIを使ってカメラを表示させてみる – o24ブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
getUserMedia(WebRTC) and Analyser(Web Audio API)
2012/08/01 getUserMedia()がChrome安定版で利用可能に- 本日のHTML5とか最新情報 - IT-Walker on hatena