-
Notifications
You must be signed in to change notification settings - Fork 4
Open
Description
Hello,
I’m trying to integrate react-native-outline-vpn into a new React Native project (RN 0.75.3 / Android). I installed the package, imported it, and used the following code:
import { useEffect } from 'react';
import { StyleSheet, View, TouchableOpacity, Text } from 'react-native';
import Outline from 'react-native-outline-vpn';
const vpnData = {
host: 'srv.xyz',
port: 1234,
password: 'PBJVUoyVFEcCOda0uvseVaa',
method: 'chacha20-ietf-poly1305',
prefix: '\u0005\u00DC\u005F\u00E0\u0001\u0020',
providerBundleIdentifier: 'org.reactjs.native.OutlineVpn.OutlineVpn', //apple bundle identifier declared step-2 on guide
serverAddress: 'OutlineServer', //can be any string which user see MyPreciousVpn
tunnelId: 'OutlineTunnel', //can be random string
localizedDescription: 'OutlineVpn', //can be random string
}
export default function App() {
const startConnnection = () => {
console.log('Starting Connection : ', vpnData)
Outline.startVpn(vpnData).then((res) => {
console.log('Connection Status : ', res)
}).catch((err) => {
console.log('Connection Error : ', err)
})
}
const stopConnnection = () => {
console.log('Stopping Connection')
Outline.stopVpn()
}
// Tried both inside and outside useEffect – same result
// useEffect(() => {
// Outline.startVpn(vpnData);
// }, []);
return (
<View style={styles.container}>
<TouchableOpacity onPress={startConnnection} style={{ marginTop: 20 }}>
<Text>Tap for Starting</Text>
</TouchableOpacity>
<Text>Connection Status : !!!</Text>
<TouchableOpacity onPress={stopConnnection} style={{ marginTop: 20 }}>
<Text>Tap for Stopping</Text>
</TouchableOpacity>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
box: {
width: 60,
height: 60,
marginVertical: 20,
},
});
What I’ve tried
Calling Outline.startVpn(vpnData) both inside and outside a useEffect.
Verifying that the native module is linked.
Checking logs on both emulator and physical device.
Observed behavior
The promise from startVpn() always resolves to true.
No actual VPN tunnel appears in device settings.
No error is thrown or logged.
Environment:
React Native: 0.75.3
react-native-outline-vpn: 1.0.7
Android API 36
Additional context
I can confirm the server is reachable (tested via Outline desktop client).
App has all required permissions and entitlements.
Could someone please advise what I’m missing or how to debug further? Any pointers would be greatly appreciated!
Metadata
Metadata
Assignees
Labels
No labels