読者です 読者をやめる 読者になる 読者になる

Browser

Microsoft Edge(Project Spartan, Internet Explorer) 、ブラウザ周辺、Web フロントエンド開発、UI、など

Microsoft Edge まとめページ

Windows 10 Insider Preview Build 10074 の Project Spartan で getUserMedia API が動きました

数日前に動かないと記事に書きましたが、アドレスバーに about:flags を入力、Enable experimental JavaScript features のチェックを入れてブラウザを再起動すると動作しました。

 

Project Spartan (Microsoft Edge) は W3C の Media Capture And Stream を基につくっている模様。
http://w3c.github.io/mediacapture-main/getusermedia.html

その為、ChromeFirefox と構文が異なります。

 

Test Drive にあったカメラキャプチャのサンプルで使わなものやエラー処理を省いてサンプルをつくってみました。(Windows 8.1ChromeFirefox でも検証済み)

media_test

f:id:x67x6fx74x6f:20150516021357p:plain


カメラの使用許可のメッセージが出るので了承しましょう。
ビデオキャプチャされている動画をクリックすると、隣にスクリーンショットが作成され、さらにそれをクリックすると画像が保存されます。

 

やらかしてしまった

Project Spartan (Microsoft Edge) はデフォルトのキャプチャサイズが 640 × 360 で 16:9。
どうやらキャプチャサイズを指定しないとデフォルトサイズになるようです。
その為、固定サイズでキャンバスに画像を持ってくるとこのような残念なサンプルが出来上がります。

 

注意点
  • Preview ですので 画像のクオリティが低いです。
  • Mac と違い、WIndows は使用するカメラが既にほかで起動されているとエラーを吐き動作しません。(例えば Surface の様にフロントとバック等別々のカメラの場合は動く)

 

ぴーえす1

試してみましたが Windows 10 Mobile Insider Preview Build 10080 では動作しませんでした。

 

ぴーえす2

getUserMedia API、Promise を使って呼び出す方法が今回の参照元に書いてあります。


参照元

blogs.windows.com

 

Wndows 10 Mobile でも動くようになりました。
1行だけコードの追加が必要です。

browser.hatenablog.com

スポンサーリンク