Skip to content

Latest commit

 

History

History
132 lines (102 loc) · 4.05 KB

File metadata and controls

132 lines (102 loc) · 4.05 KB

React Native OpenVPN Banner

React Native Turbo Module OpenVPN Support MIT License

Features

⚡ Turbo Module architecture for optimal performance
🍎 +70 Dynamically Controlled OpenVPN Options
🔔 Customizable notifications with actions and timers
🔄 Event-driven connection state management
🔧 OpenVPN 2.x and 3.x SDK compatibility
📝 Fully typed APIs with IntelliSense support
🔐 Multiple TLS profiles and security options
📄 Config file support and inline configurations
🌐 Advanced routing and custom DNS features

🧭 Fast Navigation

📦 Installation - Complete setup and platform configuration guide
→ Browse Installation Guide

📋 API Reference - Complete method and interface documentation
→ Browse API Documentation

💡 Usage Example - Practical implementation examples and guides
→ View Usage Examples

🔧 Troubleshoot and Debug - Problem solutions and debugging tools
→ Access Troubleshooting Guide


📦 Installation

Quick Install

# Using npm
npm install @aliakhgar1/react-native-openvpn

# Using yarn
yarn add @aliakhgar1/react-native-openvpn

# Install iOS dependencies (iOS only)
cd ios && pod install

🎯 Prerequisites

React Native: 0.68+
Android: API 24+
iOS: 15.1+


🚀 Quick Start

Get up and running with VPN connectivity in under 5 minutes:

import * as OpenVPN from 'react-native-openvpn';

// 1. Check permissions (Android only)
const connectToVPN = async () => {
  if (Platform.OS === 'android') {
    const isPrepared = await OpenVPN.isPrepared();
    if (!isPrepared) {
      const granted = await OpenVPN.prepare();
      if (!granted) return; // User denied permission
    }
  }

  // 2. Connect with minimal configuration
  await OpenVPN.connect({
    address: 'your-vpn-server.com',
    username: 'your-username', 
    password: 'your-password',
    openVPNConfig: yourOvpnConfigString,
    
    iOSOptions: {
      localizedDescription: 'My VPN Connection',
      networkExtensionBundleIdentifier: 'com.yourapp.vpn-extension',
      disconnectOnSleep: false,
      onDemandEnabled: false,
    },
    
    androidOptions: {
      Notification: {
        openActivityPackageName: 'com.yourapp.MainActivity',
        titleNotification: 'VPN Connected',
        titleConnected: '🔒 Secure Connection Active',
        titleConnecting: '🔄 Connecting to VPN...',
        showDisconnectAction: true,
      },
    },
  });
};

// 3. Listen for connection state changes
const subscription = OpenVPN.addOpenVPNStateChangeListener((state) => {
  switch (state.state) {
    case OpenVPN.ConnectionState.CONNECTED:
      console.log('🟢 VPN Connected Successfully!');
      break;
    case OpenVPN.ConnectionState.DISCONNECTED:
      console.log('🔴 VPN Disconnected');
      break;
    case OpenVPN.ConnectionState.CONNECTING:
      console.log('🟡 Connecting to VPN...');
      break;
  }
});

// 4. Disconnect when done
await OpenVPN.disconnect();
subscription.remove();