iOSでgetUserMediaを使用して寸法を変更するにはどうすればよいですか？

Question

AppleのiOS 11 webRTCとgetUserMediaの紹介以来、私は<video>要素にカメラの入力を得ることができますが、従来の方法で寸法（heightと）を設定することはできません。

var constraints = { 
    audio: false, 
    video: { facingMode: 'user' } 
}; 

navigator.mediaDevices.getUserMedia(constraints).then(
    function success(stream) { 
     video.srcObject = stream; 
    } 
); 

これは（iOSののみ）動作しない、およびNO画像が表示されない：

これは動作

var constraints = { 
    audio: false, 
    video: { facingMode: 'user', width: 306, height: 180 } 
}; 

navigator.mediaDevices.getUserMedia(constraints).then(
    function success(stream) { 
     video.srcObject = stream; 
    } 
); 

catchからのエラーメッセージ：

無効な制約

---

失敗の試み：はmandatoryを設定し、ideal、minHeightなど

---

これはバグですか？既知の選択肢はありますか？

Answer 1

これはSafariのバグのようです。 width: 306のような裸の値はsupposed to mean idealですが、Safariはそれらをexactのように扱いますが、ユーザーのカメラが提供するドライバの解像度と正確に一致しない限り、エラーが発生します。

それ以外のSafariは、FirefoxとEdgeのような他のブラウザのように機能しているように見えます.FirefoxとEdgeの目的は、カメラが提供するベストマッチのネイティブ解像度を見つけることです。

Safariがこれを修正するまで範囲に固執してください。

navigator.mediaDevices.getUserMedia({video: {width: {min: 320, max: 640}}}) 

...または代替戦略と共通の値を使用する： `.catch（関数（E）{console.errorの（e）;}）を添加

try { 
    await navigator.mediaDevices.getUserMedia({video: {width: 320}}) 
} catch(e) { 
    await navigator.mediaDevices.getUserMedia({video: {width: 640}}) 
}