Merge pull request #257 from AgoraIO/dev-xuch

NEW: request permission before getDevices
AgoraIO · Jan 30, 2021 · 7f1060c · 7f1060c
2 parents fb0947f + 125e05e
commit 7f1060c
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 21 deletions.
diff --git a/One-to-One-Video/Agora-Web-Tutorial-1to1-Webpack/src/common.js b/One-to-One-Video/Agora-Web-Tutorial-1to1-Webpack/src/common.js
@@ -104,6 +104,19 @@ export function removeView (id) {
  }
 }
 
+export function requestPermission(next) {
+ const tempAudioVideoStream = AgoraRTC.createStream({ audio: true, video: true })
+ const callback = function (hasPermission) {
+ tempAudioVideoStream.close()
+ next(hasPermission)
+ }
+ tempAudioVideoStream.init(function () {
+ callback(true)
+ }, function () {
+ callback(false)
+ })
+}
+
 export function getDevices (next) {
  AgoraRTC.getDevices(function (items) {
  items.filter(function (item) {

diff --git a/One-to-One-Video/Agora-Web-Tutorial-1to1-Webpack/src/index.js b/One-to-One-Video/Agora-Web-Tutorial-1to1-Webpack/src/index.js
@@ -1,30 +1,35 @@
 import RTCClient from './rtc-client'
-import {getDevices, Toast, serializeFormData, validator, resolutions} from './common'
+import {requestPermission, getDevices, Toast, serializeFormData, validator, resolutions} from './common'
 import './assets/style.css'
 import * as M from 'materialize-css'
 // import {setFormData, parseFromSearch} from './searchParam';
 
-$(() => { 
- getDevices(function (devices) {
- devices.audios.forEach(function (audio) {
- $('<option/>', {
- value: audio.value,
- text: audio.name,
- }).appendTo('#microphoneId')
- })
- devices.videos.forEach(function (video) {
- $('<option/>', {
- value: video.value,
- text: video.name,
- }).appendTo('#cameraId')
- })
- resolutions.forEach(function (resolution) {
- $('<option/>', {
- value: resolution.value,
- text: resolution.name
- }).appendTo('#cameraResolution')
+$(() => {
+ requestPermission(function (hasPermission) {
+ if (!hasPermission) {
+ Toast.error('no camera or microphone permission!')
+ }
+ getDevices(function (devices) {
+ devices.audios.forEach(function (audio) {
+ $('<option/>', {
+ value: audio.value,
+ text: audio.name,
+ }).appendTo('#microphoneId')
+ })
+ devices.videos.forEach(function (video) {
+ $('<option/>', {
+ value: video.value,
+ text: video.name,
+ }).appendTo('#cameraId')
+ })
+ resolutions.forEach(function (resolution) {
+ $('<option/>', {
+ value: resolution.value,
+ text: resolution.name
+ }).appendTo('#cameraResolution')
+ })
+ M.AutoInit()
  })
- M.AutoInit()
  })
 
  const fields = ['appID', 'channel']