extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2024-11-23 00:33:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

Check secured context before trying to list cameras - Fixes #276

Browse Source
This commit is contained in:
Bubka 2024-01-17 14:27:45 +01:00
parent b9abcb3d18
commit 45d2ca55ec
1 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
resources/js/views/twofaccounts/Capture.vue
View File

@ -12,8 +12,8 @@
const notify = useNotifyStore() const notify = useNotifyStore()
const cameraIsOn = ref(false) const cameraIsOn = ref(false)
const selectedDevice = ref(null) const selectedCamera = ref(null)
const devices = ref([]) const cameras = ref([])
const errorPhrase = ref('') const errorPhrase = ref('')
const form = reactive(new Form({ const form = reactive(new Form({
qrcode: null, qrcode: null,
@ -22,11 +22,19 @@
const showQrContent = ref(false) const showQrContent = ref(false)
onMounted(async () => { onMounted(async () => {
devices.value = (await navigator.mediaDevices.enumerateDevices()) if (!navigator.mediaDevices?.enumerateDevices) {
.filter(({ kind }) => kind === 'videoinput') errorPhrase.value = 'secured_context_required'
} else {
await navigator.mediaDevices.enumerateDevices().then((devices) => {
cameras.value = devices.filter(({ kind }) => kind === 'videoinput')
if (devices.value.length > 0) { if (cameras.value.length > 0) {
selectedDevice.value = devices.value[0] selectedCamera.value = cameras.value[0]
}
})
.catch((err) => {
onError(err)
})
} }
}) })
@ -176,7 +184,7 @@
</div> </div>
<div v-show="!errorPhrase" class="fullscreen-streamer"> <div v-show="!errorPhrase" class="fullscreen-streamer">
<qrcode-stream <qrcode-stream
v-if="selectedDevice !== null" v-if="selectedCamera !== null"
:track="paintOutline" :track="paintOutline"
@detect="onDetect" @detect="onDetect"
@error="onError" @error="onError"
@ -184,12 +192,12 @@
@camera-off="cameraOff" @camera-off="cameraOff"
></qrcode-stream> ></qrcode-stream>
<!-- device selector --> <!-- device selector -->
<div v-if="cameraIsOn && devices.length > 1" class="field has-addons has-addons-centered mt-3"> <div v-if="cameraIsOn && cameras.length > 1" class="field has-addons has-addons-centered mt-3">
<p class="control has-icons-left"> <p class="control has-icons-left">
<span class="select"> <span class="select">
<select v-model="selectedDevice"> <select v-model="selectedCamera">
<option v-for="device in devices" :key="device.label" :value="device"> <option v-for="camera in cameras" :key="camera.label" :value="camera">
{{ device.label ? device.label : $t('commons.default') }} {{ camera.label ? camera.label : $t('commons.default') }}
</option> </option>
</select> </select>
</span> </span>