RTCMultiConnection/docs/ios-android.md
Note: RTCMultiConnection supports Safari-11 browser both on iOS and MacOSX.
So you do not need to build a cordova or ionic application.
Here is list of all cordova/iosnic demos:
Please check these docs as well:
This page explains how to write iOS+Android phonegap/cordova applications for RTCMultiConnection.
Please check all iOS+Android demos here:
| DemoTitle | DownloadZip | AndroidAPK | AllFiles |
|---|---|---|---|
| Scalable Broadcast | Source | Android APK | All files |
| Audio Conferencing | Source | Android APK | All files |
| Video Conferencing | Source | Android APK | All files |
| File Sharing | Source | Android APK | All files |
latestlatestlatestCheck xcode-build-version: xcodebuild -version
Make sure that terminal is using latest xcode:
xcode-select --print-path
# maybe [sudo]
xcode-select -switch /Applications/Xcode5.1.1/Xcode.app
# if a command fails, try with [sudo]
npm install cordova -g
npm install xcode -g
cordova create ./yourAppName org.yourAppName yourAppName
cd yourAppName
cordova plugin add cordova-plugin-iosrtc
Now compile SWIFT parameters:
cd hooks
wget https://raw.githubusercontent.com/eface2face/cordova-plugin-iosrtc/master/extra/hooks/iosrtc-swift-support.js
# maybe [sudo]
chmod +x iosrtc-swift-support.js
cd ..
Now modify config.xml for this section:
<platform name="ios">
<hook type="after_platform_add" src="hooks/iosrtc-swift-support.js" />
</platform>
Now add platforms. If you already added, please remove all existing platforms, and add them again. Otherwise, you'll see errors during cordova build ios or cordova build android:
Note: Do same if you change your app's name in the "config.xml" file. Make sure to remove and re-add all platforms.
# remove any existing platform
cordova platform remove ios
cordova platform remove android
# add latest platform versions
cordova platform add [email protected]
cordova platform add [email protected]
cordova build ios
cordova build android
Now open `platforms/ios/ProjectName.xcodeproj". It may ask this:
"Convert to Latest Swift Syntax?"
Simply click Cancel button. We're OK with old syntax.
config.xml hintsModify platform/android/AndroidManifest.xml for <uses-permission android:name="android.permission.CAMERA"/> and a few others. Now getUserMedia API will work in Android.
An example AndroidManifest.xml file:
<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="30001" android:versionName="3.0.1" package="rmc3.videoconference" xmlns:android="http://schemas.android.com/apk/res/android">
<supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
<uses-permission android:name="android.permission.INTERNET" />
<application android:hardwareAccelerated="true" android:icon="@mipmap/icon" android:label="@string/app_name" android:supportsRtl="true">
<activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:theme="@android:style/Theme.DeviceDefault.NoActionBar" android:windowSoftInputMode="adjustResize">
<intent-filter android:label="@string/launcher_name">
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-sdk android:minSdkVersion="16" android:targetSdkVersion="24" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.MICROPHONE" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
</manifest>
An example config.xml file (make sure that icon.png has valid path):
<?xml version='1.0' encoding='utf-8'?>
<widget id="rmc3.videoconference" version="3.0.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>Video Conferencing</name>
<icon src="www/img/icon.png" />
<description>
Peer-to-Peer Application
</description>
<author email="[email protected]" href="https://www.webrtc-experiment.com/">
Muaz khan
</author>
<content src="index.html" />
<allow-navigation href="*" />
<allow-intent href="*" />
<access origin="*" />
<platform name="android">
<preference name="Orientation" value="default" />
<preference name="KeepRunning" value="true" />
<preference name="AndroidLaunchMode" value="singleTop" />
</platform>
<platform name="ios">
<preference name="Orientation" value="all" />
<hook src="hooks/iosrtc-swift-support.js" type="after_platform_add" />
<config-file parent="CFBundleURLTypes" target="*-Info.plist">
<array>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true />
</dict>
</array>
</config-file>
<config-file parent="NSCameraUsageDescription" target="*-Info.plist" platform="ios">
<string>WebRTC uses your camera to make video calls.</string>
</config-file>
<config-file parent="NSMicrophoneUsageDescription" target="*-Info.plist" platform="ios">
<string>WebRTC uses your microphone to make voice calls.</string>
</config-file>
</platform>
<plugin name="cordova-plugin-whitelist" spec="latest" />
<plugin name="cordova-plugin-iosrtc" spec="latest" />
<plugin name="cordova-plugin-device" spec="latest" />
<plugin name="cordova-plugin-crosswalk-webview" spec="latest" />
</widget>
This section explains how to integrate RTCMultiConnection for both iOS and Android apps.
Download and link RTCMultiConnection.js:
<!DOCTYPE html>
<html lang="en">
<head>
<title>CordovaApp using RTCMultiConnection</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<!-- your UI code -->
<script src="cordova.js"></script>
<script src="js/socket.io.js"></script>
<script src="js/RTCMultiConnection.js"></script>
<script src="js/index.js"></script>
</body>
</html>
www/js/index.js:
// please read below comments:
document.addEventListener('deviceready', function() {
// you can put your custom-ui-codes here
// e.g.
// var connection = new RTCMultiConnection();
}, false);
window.iOSDefaultAudioOutputDevice = 'speaker'; // earpiece or speaker
// set above line, before below one
var connection = new RTCMultiConnection();
RTCMultiConnection is released under MIT licence . Copyright (c) Muaz Khan.