feat(mobile): add webrtc permission grant and allow webrtc service work correct

client/mobile/android/app/src/main/AndroidManifest.xml

@@ -1,8 +1,12 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android">
+    <!-- 这份不需要，应该是默认都有的。但是保留万一有的手机不行还可以手动添加 -->
+    <!-- <uses-feature android:name="android.hardware.audio.output" />
+    <uses-feature android:name="android.hardware.microphone" /> -->
 
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.CAMERA" />
     <uses-permission android:name="android.permission.RECORD_AUDIO" />
+    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
 
     <application
       android:name=".MainApplication"

client/mobile/src/AppMain.tsx

@@ -21,6 +21,7 @@ export const AppMain: React.FC<Props> = React.memo((props) => {
       <WebView
         ref={webviewRef}
         source={{ uri: props.host }}
+        mediaPlaybackRequiresUserAction={false}
         injectedJavaScriptBeforeContentLoaded={generateInjectedScript()}
         onMessage={(e) => {
           if (!webviewRef.current) {

client/mobile/src/lib/permissions/index.ts

@@ -0,0 +1,22 @@
+import { request, check, PERMISSIONS } from 'react-native-permissions';
+import { Platform } from 'react-native';
+
+export async function ensureWebRTCPermission() {
+  const cameraPermission =
+    Platform.OS === 'ios' ? PERMISSIONS.IOS.CAMERA : PERMISSIONS.ANDROID.CAMERA;
+  const microphonePermission =
+    Platform.OS === 'ios'
+      ? PERMISSIONS.IOS.MICROPHONE
+      : PERMISSIONS.ANDROID.RECORD_AUDIO;
+
+  const [cameraPermissionStatus, microphonePermissionStatus] =
+    await Promise.all([check(cameraPermission), check(microphonePermission)]);
+
+  if (microphonePermissionStatus !== 'granted') {
+    await request(microphonePermission);
+  }
+
+  if (cameraPermissionStatus !== 'granted') {
+    await request(cameraPermission);
+  }
+}

client/mobile/src/lib/utils/index.ts

@@ -33,3 +33,7 @@ export function urlResolve(...str: string[]) {
   });
   return normalize(flatten);
 }
+
+export function isDev(): boolean {
+  return !!__DEV__;
+}

client/mobile/src/types.ts

@@ -1 +1 @@
-export * from '../../../packages/types/index';
+export * from '../../../packages/types';

client/shared/event/index.ts

@@ -23,6 +23,12 @@ export interface SharedEventMap {
    */
   loadColorScheme: (schemeName: string) => void;
 
+  /**
+   * 请求webrtc相关权限
+   * 目前用于视频会议
+   */
+  ensureWebRTCPermission: () => void;
+
   /**
    * 网络状态更新
    */

client/web/plugins/com.msgbyte.env.rn/src/index.tsx

@@ -23,6 +23,7 @@ regCustomPanel({
 });
 
 forwardSharedEvent('loadColorScheme');
+forwardSharedEvent('ensureWebRTCPermission');
 forwardSharedEvent('loginSuccess', async (payload) => {
   let token = window.localStorage.getItem('jsonwebtoken');
   try {

server/plugins/com.msgbyte.livekit/web/plugins/com.msgbyte.livekit/src/components/LivekitView.tsx

@@ -1,6 +1,6 @@
-import { showErrorToasts, useEvent } from '@capital/common';
+import { sharedEvent, showErrorToasts, useEvent } from '@capital/common';
 import { withKeepAliveOverlay } from '@capital/component';
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import type { LocalUserChoices } from '@livekit/components-react';
 import { PreJoinView } from './lib/PreJoinView';
 import { LivekitContainer } from './LivekitContainer';
@@ -56,9 +56,13 @@ export const PureLivekitView: React.FC<PureLivekitViewProps> = React.memo(
 
     const handleError = useEvent((err: Error) => {
       showErrorToasts('error while setting up prejoin');
-      console.log('error while setting up prejoin', err);
+      console.error('error while setting up prejoin', err);
     });
 
+    useEffect(() => {
+      sharedEvent.emit('ensureWebRTCPermission');
+    }, []);
+
     const handleJoin = useEvent(async (userChoices: LocalUserChoices) => {
       await props.onJoin?.();