npm
/
react-native-agora


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493
							<!doctype html>
<html class="default no-js">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>react-native-agora</title>
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="assets/css/main.css">
</head>
<body>
<header>
	<div class="tsd-page-toolbar">
		<div class="container">
			<div class="table-wrap">
				<div class="table-cell" id="tsd-search" data-index="assets/js/search.js" data-base=".">
					<div class="field">
						<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
						<input id="tsd-search-field" type="text" />
					</div>
					<ul class="results">
						<li class="state loading">Preparing search index...</li>
						<li class="state failure">The search index is not available</li>
					</ul>
					<a href="index.html" class="title">react-native-agora</a>
				</div>
				<div class="table-cell" id="tsd-widgets">
					<div id="tsd-filter">
						<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
						<div class="tsd-filter-group">
							<div class="tsd-select" id="tsd-filter-visibility">
								<span class="tsd-select-label">All</span>
								<ul class="tsd-select-list">
									<li data-value="public">Public</li>
									<li data-value="protected">Public/Protected</li>
									<li data-value="private" class="selected">All</li>
								</ul>
							</div>
							<input type="checkbox" id="tsd-filter-inherited" checked />
							<label class="tsd-widget" for="tsd-filter-inherited">Inherited</label>
							<input type="checkbox" id="tsd-filter-externals" checked />
							<label class="tsd-widget" for="tsd-filter-externals">Externals</label>
							<input type="checkbox" id="tsd-filter-only-exported" />
							<label class="tsd-widget" for="tsd-filter-only-exported">Only exported</label>
						</div>
					</div>
					<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
				</div>
			</div>
		</div>
	</div>
	<div class="tsd-page-title">
		<div class="container">
			<ul class="tsd-breadcrumb">
				<li>
					<a href="globals.html">Globals</a>
				</li>
			</ul>
			<h1> react-native-agora</h1>
		</div>
	</div>
</header>
<div class="container container-main">
	<div class="row">
		<div class="col-8 col-content">
			<div class="tsd-panel tsd-typography">
				<h5 id="-qq-471757030">有任何问题欢迎加入QQ群进行反馈  471757030</h5>
				<h2 id="for-1-x-old-version"><a href="README.old.md">for 1.x old version</a></h2>
				<h1 id="react-native-agora">react-native-agora</h1>
				<p><a href="https://www.npmjs.com/package/react-native-agora"><img src="https://img.shields.io/npm/v/react-native-agora.svg" alt="npm"></a>
					<a href="https://www.npmjs.com/package/react-native-agora"><img src="https://img.shields.io/npm/dm/react-native-agora.svg" alt="npm"></a>
					<a href="https://www.npmjs.com/package/react-native-agora"><img src="https://img.shields.io/npm/dt/react-native-agora.svg" alt="npm"></a>
					<a href="https://github.com/syanbo/react-native-agora/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/react-native-agora.svg" alt="npm"></a>
				<a href="https://gitter.im/react-native-agora/community"><img src="https://img.shields.io/badge/gitter-join%20chat-brightgreen.svg" alt="join chat"></a></p>
				<h2 id="description">Description</h2>
				<p>The react-native-agora is an open-source wrapper for react-native developers. This SDK takes advantage of React Native and Agora RTC Video SDKs on Android/iOS.</p>
				<h2 id="compatibility">Compatibility</h2>
				<ul>
					<li>react native 0.58.x</li>
					<li>iOS SDK 8.0+</li>
					<li>Android 5.0+ x86 arm64 armv7a</li>
				</ul>
				<h2 id="quick-start"><a href="https://github.com/AgoraIO-Community/Agora-RN-Quickstart">quick start</a></h2>
				<h2 id="installation">Installation</h2>
				<p>Install with npm:</p>
				<p> <code>npm install --save react-native-agora</code></p>
				<p>Or, install with yarn:</p>
				<p> <code>yarn add react-native-agora</code></p>
				<p>Either way, then link with:</p>
				<p> <code>react-native link react-native-agora</code></p>
				<h3 id="ios-installation">iOS Installation</h3>
				<p>  <a href="docs/IOS_INSTALLATION.zh.md">中文</a>
				<a href="docs/IOS_INSTALLATION.md">English</a></p>
				<h3 id="android-installation">Android Installation</h3>
				<p>  <a href="docs/ANDROID_INSTALLATION.zh.md">中文</a>
				<a href="docs/ANDROID_INSTALLATION.md">English</a></p>
				<h2 id="agora-native-api-documentation">Agora Native API Documentation</h2>
				<h3 id="android">Android</h3>
				<p>  <a href="https://docs.agora.io/cn/Video/API%20Reference/java/index.html">中文</a>
				<a href="https://docs.agora.io/en/Video/API%20Reference/java/index.html">English</a></p>
				<h2 id="ios">iOS</h2>
				<p>  <a href="https://docs.agora.io/cn/Video/API%20Reference/oc/docs/headers/Agora-Objective-C-API-Overview.html">中文</a>
				<a href="https://docs.agora.io/en/Video/API%20Reference/oc/docs/headers/Agora-Objective-C-API-Overview.html">English</a></p>
				<h2 id="2-3-api-docs"><a href="https://syanbo.github.io/react-native-agora/globals.html">2.3 API DOCS</a></h2>
				<h2 id="2-4-api-docs"><a href="https://syanbo.github.io/react-native-agora/v2.4/globals.html">2.4 API DOCS</a></h2>
				<h4 id="events">Events</h4>
				<pre><code class="language-javascript">RtcEngine.on(<span class="hljs-string">'eventName'</span>, (data) =&gt; {
    <span class="hljs-built_in">console</span>.log(data);
});</code></pre>
				<table>
					<thead>
						<tr>
							<th>Name</th>
							<th>Description</th>
							<th>Platform</th>
						</tr>
					</thead>
					<tbody><tr>
							<td>warning</td>
							<td>warning</td>
							<td>all</td>
						</tr>
						<tr>
							<td>error</td>
							<td>error</td>
							<td>all</td>
						</tr>
						<tr>
							<td>apiCallExecute</td>
							<td>capture agora native api call executed</td>
							<td>all</td>
						</tr>
						<tr>
							<td>joinChannelSuccess</td>
							<td>join channel success</td>
							<td>all</td>
						</tr>
						<tr>
							<td>reJoinChannelSuccess</td>
							<td>rejoin channel success</td>
							<td>all</td>
						</tr>
						<tr>
							<td>leaveChannel</td>
							<td>quit channel</td>
							<td>all</td>
						</tr>
						<tr>
							<td>clientRoleChanged</td>
							<td>when changed client role</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userJoined</td>
							<td>when user joined channel</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userOffline</td>
							<td>when user left channel</td>
							<td>all</td>
						</tr>
						<tr>
							<td>connectionStateChanged</td>
							<td>when connection state changed</td>
							<td>all</td>
						</tr>
						<tr>
							<td>connectionLost</td>
							<td>when connection lost</td>
							<td>all</td>
						</tr>
						<tr>
							<td>tokenPrivilegeWillExpire</td>
							<td>when token will expire</td>
							<td>all</td>
						</tr>
						<tr>
							<td>requestToken</td>
							<td>when token expired</td>
							<td>all</td>
						</tr>
						<tr>
							<td>microphoneEnabled</td>
							<td>when microphone enabled</td>
							<td>all</td>
						</tr>
						<tr>
							<td>audioVolumeIndication</td>
							<td>notice audio volume</td>
							<td>all</td>
						</tr>
						<tr>
							<td>activeSpeaker</td>
							<td>reports which user is the loudest speaker</td>
							<td>all</td>
						</tr>
						<tr>
							<td>firstLocalAudioFrame</td>
							<td>when the first local audio frame is sent</td>
							<td>all</td>
						</tr>
						<tr>
							<td>firstRemoteAudioFrame</td>
							<td>when the first remote audio frame is sent</td>
							<td>all</td>
						</tr>
						<tr>
							<td>videoStopped</td>
							<td>when video stopped</td>
							<td>all</td>
						</tr>
						<tr>
							<td>firstLocalVideoFrame</td>
							<td>when first local video frame is sent</td>
							<td>all</td>
						</tr>
						<tr>
							<td>firstRemoteVideoDecoded</td>
							<td>when first remote video is decoded</td>
							<td>all</td>
						</tr>
						<tr>
							<td>firstRemoteVideoFrame</td>
							<td>when first remote video frame is rendered</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userMuteAudio</td>
							<td>when a remote user&#39;s audio stream is muted/unmuted</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userMuteVideo</td>
							<td>when a remote user&#39;s video stream is muted/unmuted</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userEnableVideo</td>
							<td>when a remote user enables/disables the video module</td>
							<td>all</td>
						</tr>
						<tr>
							<td>userEnableLocalVideo</td>
							<td>when a remote user enables/disables the local video capture function</td>
							<td>all</td>
						</tr>
						<tr>
							<td>videoSizeChanged</td>
							<td>when the video size or rotation information of a specified remote user changes</td>
							<td>all</td>
						</tr>
						<tr>
							<td>remoteVideoStateChanged</td>
							<td>when the remote video stream state changes</td>
							<td>all</td>
						</tr>
						<tr>
							<td>localPublishFallbackToAudioOnly</td>
							<td>Occurs when the published video stream falls back to an audio-only stream due to unreliable network conditions or switches back to the video when the network conditions improve.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>remoteSubscribeFallbackToAudioOnly</td>
							<td>Occurs when the remote video stream falls back to an audio-only stream due to unreliable network conditions or switches back to the video after the network conditions improve.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>audioRouteChanged</td>
							<td>when the local audio pkayout route changes</td>
							<td>all</td>
						</tr>
						<tr>
							<td>cameraReady</td>
							<td>when the camera is turned on and ready to capture video</td>
							<td>all</td>
						</tr>
						<tr>
							<td>cameraFocusAreaChanged</td>
							<td>when the camera focus area is changed</td>
							<td>all</td>
						</tr>
						<tr>
							<td>cameraExposureAreaChanged</td>
							<td>The camera exposure area has changed</td>
							<td>all</td>
						</tr>
						<tr>
							<td>remoteAudioStats</td>
							<td>Reports the statistics of the audio stream from each remote user/host.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>rtcStats</td>
							<td>Reports the statistics of the RtcEngine once every two seconds</td>
							<td>all</td>
						</tr>
						<tr>
							<td>lastmileQuality</td>
							<td>Reports the last mile network quality of the local user once every two seconds before the user joins the channel. Last mile refers to the connection between the local device and Agora&#39;s edge server. After the application calls the enableLastmileTest method, this callback reports once every two seconds the uplink and downlink last mile network conditions of the local user before the user joins the channel.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>networkQuality</td>
							<td>Reports the last mile network quality of each user in the channel once every two seconds. Last mile refers to the connection between the local device and Agora&#39;s edge server. This callback reports once every two seconds the uplink last mile network conditions of each user in the channel. If a channel includes multiple users, then this callback will be triggered as many times.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>localVideoStats</td>
							<td>Reports the statistics of the uploading local video streams. This callback is triggered once every two seconds for each individual user/host. If there are multiple users/hosts in the channel, this callback is triggered multiple times every 2 seconds.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>remoteVideoStats</td>
							<td>Reports the statistics of the video stream from each remote user/host. The SDK triggers this callback once every two seconds for each remote user/host. If a channel includes multiple remote users, the SDK triggers this callback as many times. This callback reports statistics more closely linked to the real-user experience of the video transmission quality than the statistics that the onRemoteVideoTransportStats callback reports</td>
							<td>all</td>
						</tr>
						<tr>
							<td>audioTransportStatsOfUid</td>
							<td>Reports the transport-layer statistics of each remote audio stream.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>videoTransportStatsOfUid</td>
							<td>Reports the transport-layer statistics of each remote video stream.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>localAudioMixingFinish</td>
							<td>Occurs when the audio mixing file playback finishes.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>remoteAudioMixingStart</td>
							<td>Occurs when a remote user starts audio mixing.</td>
							<td>ios</td>
						</tr>
						<tr>
							<td>remoteAudioMixingFinish</td>
							<td>Occurs when a remote user finishes audio mixing.</td>
							<td>ios</td>
						</tr>
						<tr>
							<td>audioEffectFinish</td>
							<td>Occurs when the audio effect file playback finishes.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>streamPublished</td>
							<td>Occurs when a CDN live stream is published.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>streamUnpublish</td>
							<td>Occurs when CDN live streaming stops. This callback notifies the host that the CDN live stream is unpublished.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>transcodingUpdate</td>
							<td>Occurs when the publisher&#39;s transcoding settings are updated.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>streamInjectedStatus</td>
							<td>Reports the status of the injected online media stream.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>receiveStreamMessage</td>
							<td>Occurs when the local user receives a remote data stream within five seconds.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>occurStreamMessageError</td>
							<td>Occurs when the local user fails to receive a remote data stream.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>mediaEngineLoaded</td>
							<td>Occurs when the media engine is loaded.</td>
							<td>all</td>
						</tr>
						<tr>
							<td>mediaEngineStartCall</td>
							<td>Occurs when the media engine starts.</td>
							<td>all</td>
						</tr>
				</tbody></table>
				<h2 id="resources">Resources</h2>
				<ul>
					<li>Complete <a href="https://docs.agora.io/en/">API documentation</a> at the Developer Center</li>
					<li><a href="https://github.com/syanbo/react-native-agora/issues">File bugs about this sample</a></li>
					<li><a href="https://facebook.github.io/react-native/docs/getting-started.html">React Native Getting Started</a></li>
				</ul>
			</div>
		</div>
		<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
			<nav class="tsd-navigation primary">
				<ul>
					<li class="globals  ">
						<a href="globals.html"><em>Globals</em></a>
					</li>
				</ul>
			</nav>
			<nav class="tsd-navigation secondary menu-sticky">
				<ul class="before-current">
					<li class=" tsd-kind-class tsd-has-type-parameter">
						<a href="classes/agoraview.html" class="tsd-kind-icon">Agora<wbr>View</a>
					</li>
					<li class=" tsd-kind-class">
						<a href="classes/rtcengine.html" class="tsd-kind-icon">Rtc<wbr>Engine</a>
					</li>
					<li class=" tsd-kind-variable tsd-is-not-exported">
						<a href="globals.html#agora" class="tsd-kind-icon">Agora</a>
					</li>
					<li class=" tsd-kind-variable tsd-is-not-exported">
						<a href="globals.html#agoraeventemitter" class="tsd-kind-icon">Agora<wbr>Event<wbr>Emitter</a>
					</li>
					<li class=" tsd-kind-variable tsd-is-not-exported">
						<a href="globals.html#rctagoraview" class="tsd-kind-icon">RCTAgora<wbr>View</a>
					</li>
				</ul>
			</nav>
		</div>
	</div>
</div>
<footer class="with-border-bottom">
	<div class="container">
		<h2>Legend</h2>
		<div class="tsd-legend-group">
			<ul class="tsd-legend">
				<li class="tsd-kind-module"><span class="tsd-kind-icon">Module</span></li>
				<li class="tsd-kind-object-literal"><span class="tsd-kind-icon">Object literal</span></li>
				<li class="tsd-kind-variable"><span class="tsd-kind-icon">Variable</span></li>
				<li class="tsd-kind-function"><span class="tsd-kind-icon">Function</span></li>
				<li class="tsd-kind-function tsd-has-type-parameter"><span class="tsd-kind-icon">Function with type parameter</span></li>
				<li class="tsd-kind-index-signature"><span class="tsd-kind-icon">Index signature</span></li>
				<li class="tsd-kind-type-alias"><span class="tsd-kind-icon">Type alias</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-enum"><span class="tsd-kind-icon">Enumeration</span></li>
				<li class="tsd-kind-enum-member"><span class="tsd-kind-icon">Enumeration member</span></li>
				<li class="tsd-kind-property tsd-parent-kind-enum"><span class="tsd-kind-icon">Property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-enum"><span class="tsd-kind-icon">Method</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-interface"><span class="tsd-kind-icon">Interface</span></li>
				<li class="tsd-kind-interface tsd-has-type-parameter"><span class="tsd-kind-icon">Interface with type parameter</span></li>
				<li class="tsd-kind-constructor tsd-parent-kind-interface"><span class="tsd-kind-icon">Constructor</span></li>
				<li class="tsd-kind-property tsd-parent-kind-interface"><span class="tsd-kind-icon">Property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-interface"><span class="tsd-kind-icon">Method</span></li>
				<li class="tsd-kind-index-signature tsd-parent-kind-interface"><span class="tsd-kind-icon">Index signature</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-class"><span class="tsd-kind-icon">Class</span></li>
				<li class="tsd-kind-class tsd-has-type-parameter"><span class="tsd-kind-icon">Class with type parameter</span></li>
				<li class="tsd-kind-constructor tsd-parent-kind-class"><span class="tsd-kind-icon">Constructor</span></li>
				<li class="tsd-kind-property tsd-parent-kind-class"><span class="tsd-kind-icon">Property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-class"><span class="tsd-kind-icon">Method</span></li>
				<li class="tsd-kind-accessor tsd-parent-kind-class"><span class="tsd-kind-icon">Accessor</span></li>
				<li class="tsd-kind-index-signature tsd-parent-kind-class"><span class="tsd-kind-icon">Index signature</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-constructor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited constructor</span></li>
				<li class="tsd-kind-property tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited method</span></li>
				<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited accessor</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-property tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected method</span></li>
				<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected accessor</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private property</span></li>
				<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private method</span></li>
				<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private accessor</span></li>
			</ul>
			<ul class="tsd-legend">
				<li class="tsd-kind-property tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static property</span></li>
				<li class="tsd-kind-call-signature tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static method</span></li>
			</ul>
		</div>
	</div>
</footer>
<div class="container tsd-generator">
	<p>Generated using <a href="http://typedoc.org/" target="_blank">TypeDoc</a></p>
</div>
<div class="overlay"></div>
<script src="assets/js/main.js"></script>
<script>if (location.protocol == 'file:') document.write('<script src="assets/js/search.js"><' + '/script>');</script>
</body>
</html>