Simple WebView Bridge - Flutter SDK #

A lightweight WebView bridge for Flutter that automatically posts app context to web pages.

Installation #

Add this to your pubspec.yaml:

dependencies:
  simple_webview_bridge: ^1.0.0
  webview_flutter: ^4.0.0
  package_info_plus: ^4.0.0

Then run:

flutter pub get

Platform-Specific Setup #

Android

Add internet permission to your android/app/src/main/AndroidManifest.xml:

<uses-permission android:name="android.permission.INTERNET" />

iOS

Add this to your ios/Runner/Info.plist:

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

For iOS 14+, also add:

<key>io.flutter.embedded_views_preview</key>
<true/>

Usage #

import 'package:flutter/material.dart';
import 'package:simple_webview_bridge/simple_webview_bridge.dart';

class MyWebViewPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('WebView Bridge Example'),
      ),
      body: SimpleWebViewBridge(
        initialUrl: 'https://your-website.com',
        onPageFinished: (url) {
          print('Page loaded: $url');
        },
      ),
    );
  }
}

What It Does #

When the WebView finishes loading a page, it automatically sends this message to the web page:

{
  type: 'APP_CONTEXT',
  appId: 'com.example.yourapp',  // Your app's package name
  platform: 'android'              // or 'ios'
}

Receiving the Message in Your Web Page #

In your web page, listen for the message like this:

window.addEventListener('message', (event) => {
  const data = event.data;

  if (data.type === 'APP_CONTEXT') {
    console.log('App ID:', data.appId);
    console.log('Platform:', data.platform);

    // Now you can use this information to customize the web experience
    // or verify that the page is being loaded from your app
  }
});

API Reference #

SimpleWebViewBridge #

Properties

• initialUrl (required, String): The URL to load in the WebView
• onPageStarted (optional, Function(String)): Callback when page starts loading
• onPageFinished (optional, Function(String)): Callback when page finishes loading
• javascriptMode (optional, JavascriptMode): JavaScript mode (defaults to JavascriptMode.unrestricted)

License #

MIT