I am working on React Native app to make a call using Twilio programmable voice call I am able to integrate it for android but call function is not working
await TwilioVoice.initWithToken(token)
returns return "initialized:true"
But
TwilioVoice.addEventListener('deviceReady', () => {
this.setState({ twilioInited: true });
});
is not working
to make a call even if I have manually set it to true but no response on
makeCall button
shown in blow code
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View,TouchableOpacity,
PermissionsAndroid} from 'react-native';
import TwilioVoice from 'react-native-twilio-programmable-voice';
await TwilioVoice.initWithToken(token)
returns return "initialized:true"
But
TwilioVoice.addEventListener('deviceReady', () => {
this.setState({ twilioInited: true });
});
is not working
to make a call even if I have manually set it to true but no response on
makeCall button
shown in blow code
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View,TouchableOpacity,
PermissionsAndroid} from 'react-native';
import TwilioVoice from 'react-native-twilio-programmable-voice';
const instructions = Platform.select({
ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
android:
'Double tap R on your keyboard to reload,\n' +
'Shake or press menu button for dev menu',
});
type Props = {};
export default class App extends Component
<Props>
{
state = {
twilioInited: false
};
getAuthToken = () => {
return fetch('http.api.?pincode=Test&method=access_token&format=json', { //replace c2a19b17.ngrok.io with your link (from Step 1)
method: 'get',
})
.then(response => response.text())
.catch((error) => console.error(error));
}
getMicrophonePermission = () => {
const audioPermission = PermissionsAndroid.PERMISSIONS.RECORD_AUDIO;
return PermissionsAndroid.check(audioPermission).then(async result => {
if (!result) {
const granted = await PermissionsAndroid.request(audioPermission, {
title: 'Microphone Permission',
message: 'App needs access to you microphone ' + 'so you can talk with other users.',
});
}
});
}
/*async componentWillMount() {
const token = await this.getAuthToken();
alert(token);
// or
TwilioVoice.initWithToken(token);
TwilioVoice.Device.connect({To: '+12054764217'});
TwilioVoice.addEventListener('deviceReady', () => {
this.setState({ twilioInited: true });
});
}*/
initTwilio = async () => {
const token = await this.getAuthToken();
if (Platform.OS === 'android') {
await this.getMicrophonePermission();
}
const success = await TwilioVoice.initWithToken(token)
alert(JSON.stringify(success));// return "initialized:true"
TwilioVoice.addEventListener('deviceReady', () => {
this.setState({ twilioInited: true });
});
if (Platform.OS === 'ios') { //required for ios
TwilioVoice.configureCallKit({
appName: 'ReactNativeTwilioExampleApp',
});
}
};
makeCall = () => TwilioVoice.connect({'To': '+12054764217'})
render() {
return (
<View style={styles.container}>
<TouchableOpacity onPress={() =>
this.initTwilio()}>
<View>
<Text>Init Twilio</Text>
</View>
</TouchableOpacity>
<TouchableOpacity disabled={!this.state.twilioInited} onPress={() =>
this.makeCall()}>
<View>
<Text>Make call ({this.state.twilioInited ? 'ready' : 'not ready'})</Text>
</View>
</TouchableOpacity>
</View>
);
}
}
