reactnative集成 react-native-webrtc的坑太多了

第一次成功的編譯react-native + react-native-webrtc android app

好幾天了，都不見成效由於不瞭解android 的編譯過程只熟悉js所以走了很多彎路，重新學習gradle（android編譯需要gradle）參考了很多網站，最終編譯成功，但只是里程碑的一半後面的路至少不用費太多腦細胞

react-native中文網.
react-native-webrtc.

一，安裝所需要的程序

1.根據中文網安裝react-native0.61.0

npx react-native init AwesomeProject

安裝一個react-native的初始版本。

cd AwesomeProject
yarn android
# 或者
yarn react-native run-android

運行看看能否編譯成功,我用真機來調試，只要用usb插上手機就可以
或安裝特定版本號例如

npx react-native init MyApp --version 0.44.3

2.根據react-native-webrtc來安裝，我的版本號爲1.75.3

yarn add react-native-webrtc 
#或者
yarn add [email protected]
#安裝特定版本號

二，配置webrtc（踩坑）

根據react-native-webrtc配置.我踩了很多坑，有一開始看不明白到最後仔細研究每一個錯誤，暫時解決問題，現總結一下以備不時之需
我一共修改了以下文件：
1 android/build.gradle，這個文件根據官方配置需要修改，但是我沒有修改他

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 16
        compileSdkVersion = 28
        targetSdkVersion = 28
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
       classpath("com.android.tools.build:gradle:3.4.2")

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        mavenLocal()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }

        google()
        jcenter()
        maven { url 'https://jitpack.io' }
    }
}

2. android/settings.gradle 添加了後面兩個。

rootProject.name = 'doctor'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'

include ':WebRTCModule' //添加這一行
project(':WebRTCModule').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webrtc/android') //添加這一行

3 android/app/build.gradle 這裏我遇到了找不到WebRTCModule的問題，導致一系列的編譯不通過官方的方法有問題。取消不用

dependencies {
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.facebook.react:react-native:+"  // From node_modules

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }
		// compile project(':WebRTCModule')    //官方給的方法，發現不能用過時了
       //implementation':WebRTCModule'   //這個方法能用但是由於丟失了鏈式傳遞導致了錯誤 can't find WebRTCModule 所以改用下面的方法。
       implementation(project(':WebRTCModule'))
}

4 android\app\src\main\AndroidManifest.xml 給app賦予手機的各種權限

    <uses-permission android:name="android.permission.CAMERA" />
    <uses-feature android:name="android.hardware.camera" />
    <uses-feature android:name="android.hardware.camera.autofocus"/>

    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.WAKE_LOCK" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

5 android\app\src\main\java\com\xxx\MainApplication.java

package com.doctor;

import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader;
import java.lang.reflect.InvocationTargetException;
import java.util.List;
import com.oney.WebRTCModule.WebRTCModulePackage;  // <--- 添加這行信息
public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost =
      new ReactNativeHost(this) {
        @Override
        public boolean getUseDeveloperSupport() {
          return BuildConfig.DEBUG;
        }

        @Override
        protected List<ReactPackage> getPackages() {
          @SuppressWarnings("UnnecessaryLocalVariable")
          List<ReactPackage> packages = new PackageList(this).getPackages();
          // Packages that cannot be autolinked yet can be added manually here, for example:
          // packages.add(new MyReactNativePackage());
          packages.add(new WebRTCModulePackage()); // <-- 添加這行信息
          return packages;
        }
		  ....下面的語句沒有放進來注意
      };
      ....
}

6 有時候發生無法創建文件夾的問題就比如

F:\program\xxx\node_modules\react-native-webrtc\android\build\intermediates\incremental\packageDebugResources\merged.dir\values

錯誤代碼說無法創建文件夾values
我就只好手動創建 values文件夾。編譯成功，下一步就是看能否把功能實現了。