問題描述

我正在使用面向模式"約束來在兩個攝像頭之間切換，但我無法完全確定用戶端是否有環境"攝像頭(后置攝像頭).僅計算 enumerateDevices 函數返回的承諾的視頻輸入"是不夠的.

I'm using the 'facingMode' constrain in order to switch between the two cameras, but I'm not able to fully decided whether the user end has an 'environment' camera (back facing camera).. it's not enough to to count the 'videoinput' of the returned promise of enumerateDevices function.

我嘗試搜索它，我發現的只是使用視頻 MediaTrack 標簽并搜索包含面向背面"的內容.字符串，在所有瀏覽器(例如 IOS)中似乎不是恒定的.

I tried searching for it and all I found was to use the video MediaTrack label and search for containing "facing back" string, which doesnt seem to be constant in all browsers (IOS for instance).

我相信一定有更好的方法:)

I'm sure there must be a better way :)

推薦答案

這里有第二個答案.選擇前置 ( facesMode:'user') 和后置 (facingMode:'environment') 攝像頭是我正在處理的問題.

A second answer here. The selection of front (facingMode:'user') and back (facingMode:'environment') cameras is an issue for something I'm working on.

如果您有一個打開的 .getUserMedia() 流到相機，則可以判斷您正在使用哪個相機.stream.getTracks[0].getCapabilities() 返回一個帶有 facingMode:'user' 或 facingMode:'environment' 字段的對象在里面.但是您必須已經為特定設備打開了一個流才能獲得它.

It's possible to tell which camera you're using if you have an open .getUserMedia() stream to a camera. stream.getTracks[0].getCapabilities() gives back an object with either a facingMode:'user' or facingMode:'environment' field in it. But you already must have a stream open to the particular device to get this.

這是我在移動設備測試場中使用多個設備時發現的.這些是 .enumerateDevices() 產生的 device 條目的順序.

Here's what I have discovered using multiple devices in a mobile-device test farm. These are the order of the device entries yielded by .enumerateDevices().

tl;dr:在 iOs 設備上，前置攝像頭是列表中的第一個視頻輸入設備，后置攝像頭是第二個.在 Android 設備上，前置攝像頭具有字符串front"；在它們的 device.label 值中，后置攝像頭或相機具有字符串back".

tl;dr: On iOs devices, the front facing camera is the first videoinput device in the list, and the back-facing camera is the second one. On Android devices, the front facing camera or cameras have the string "front" in their device.label values and the back facing camra or cameras have the string "back".

1. 運行 Mobile Safari 的 iOS 設備:device.label 項均已本地化為當前選擇的國家語言.
2. 設備始終按此順序出現在設備陣列中，前置攝像頭始終作為陣列中的第一個設備出現，并帶有 device.kind:'videoinput'.這是我從我嘗試過的每臺 iOS 設備 auf Deutsch 中獲得的設備標簽列表:
   • 音頻輸入:iPhone Mikrofon
   • 視頻輸入:前置攝像頭
   • 視頻輸入:Rückkamera

1. iOS devices running Mobile Safari: the device.label items are all localized to the currently selected national language.
2. The devices always appear in this order in the device array, with the front camera always appearing as the first device in the array with device.kind:'videoinput'. Here is the list of devices labels I got from every iOS device I tried, auf Deutsch:
   • audioinput:iPhone Mikrofon
   • videoinput:Frontkamera
   • videoinput:Rückkamera

你可以告訴你什么時候在 iPhone 上

You can tell you’re on an iPhone when

navigator.userAgent.indexOf(' iPhone ') >= 0  

你可以告訴你什么時候在 iPad 上

You can tell you’re on an iPad when

    typeof navigator.maxTouchPoints === 'number' 
 && navigator.maxTouchPoints > 2
 && typeof navigator.vendor === 'string'
 && navigator.vendor.indexOf('Apple') >= 0

請注意，iPad Safari 現在撒謊并聲稱它是英特爾 Mac.它顯示了這個 User-Agent 字符串:

Notice that iPad Safari now lies and claims it's an Intel Mac. It presents this User-Agent string:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) 版本/14.0.1 Safari/605.1.15

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.1 Safari/605.1.15

Android 設備

1. Android 設備:device.label"項未本地化.

我查看的設備有不同的 device.label 列表.但我發現的所有攝像頭在 device.label 中都有字符串 front 或 back.

The devices I looked at had different device.label lists. But the cameras I found all had either the string front or back in the device.label.

運行 Android 11 的 Pixel 3A 具有此設備列表.

A Pixel 3A running Android 11 has this list of devices.

• 音頻輸入:標準
• 音頻輸入:免提
• 音頻輸入:耳機聽筒
• videoinput:camera2 1, 正面
• videoinput:camera2 0, 朝后
• 音頻輸出:標準

運行 Android 9 的三星 SM-A205F 有這些設備.

A Samsung SM-A205F running Android 9 has these devices in order.

• 音頻輸入:默認
• 音頻輸入:免提
• 音頻輸入:耳機聽筒
• videoinput:camera2 1, 正面
• videoinput:camera2 2, 正面
• videoinput:camera2 0, 朝后
• 音頻輸出:默認

這個列舉了兩個不同的前置自拍相機.第一個提供比第二個更高的分辨率.

This one enumerates two different front-facing selfiecams. The first one offers higher resolution than the second one.

運行 Android 6.0.1 的三星 SM-G925I

A Samsung SM-G925I running Android 6.0.1

• 音頻輸入:默認
• 音頻輸入:免提
• 音頻輸入:耳機聽筒
• videoinput:camera2 1, 正面
• videoinput:camera2 0, 朝后
• 音頻輸出:默認

順便說一下，.getSupportedConstraints() 的結果并沒有多大幫助:iOS 和 Android 都給出 faceMode:true.

And, by the way, the results of .getSupportedConstraints() don't help much: both iOS and Android give facingMode:true.

這篇關于getUserMedia 檢測前置攝像頭的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！