Flutter Inappwebview

https://inappwebview.dev/docs
Admin
Flutter Inappwebview is a plugin designed to embed web content within mobile or desktop...
Tokens:71,657
Snippets:497
Trust Score:8.3
Update:2 weeks ago
Show doc for...
Tokens:
Raw
### WebAuthenticationSession Basic Usage Example

Source: https://inappwebview.dev/docs/web-authentication-session

Complete Flutter example showing how to set up a local server, create a WebAuthenticationSession on iOS, start it, and dispose it. The session is created with a callback URL scheme 'test' and extracts a token from the callback URL. Requires iOS and WebAuthenticationSession.isAvailable().

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
InAppLocalhostServer localhostServer = InAppLocalhostServer();  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb) {  
    await localhostServer.start();  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  WebAuthenticationSession? session;  
  String? token;  
  
  @override  
  void dispose() {  
    session?.dispose();  
    super.dispose();  
  }  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
        appBar: AppBar(title: const Text('Web Authentication Session example')),  
        body: Column(children: <Widget>[  
          Center(  
              child: Container(  
            padding: const EdgeInsets.all(20.0),  
            child: Text("Token: $token"),  
          )),  
          session != null  
              ? Container()  
              : Center(  
                  child: ElevatedButton(  
                      onPressed: () async {  
                        if (session == null &&  
                            !kIsWeb &&  
                            defaultTargetPlatform == TargetPlatform.iOS &&  
                            await WebAuthenticationSession.isAvailable()) {  
                          session = await WebAuthenticationSession.create(  
                              url: WebUri(  
                                  "http://localhost:8080/assets/web-auth.html"),  
                              callbackURLScheme: "test",  
                              onComplete: (url, error) async {  
                                if (url != null) {  
                                  setState(() {  
                                    token = url.queryParameters["token"];  
                                  });  
                                }  
                              });  
                          setState(() {});  
                        } else {  
                          ScaffoldMessenger.of(context)  
                              .showSnackBar(const SnackBar(  
                            content: Text(  
                                'Cannot create Web Authentication Session!'),  
                          ));  
                        }  
                      },  
                      child: const Text("Create Web Auth Session")),  
                ),  
          session == null  
              ? Container()  
              : Center(  
                  child: ElevatedButton(  
                      onPressed: () async {  
                        var started = false;  
                        if (await session?.canStart() ?? false) {  
                          started = await session?.start() ?? false;  
                        }  
                        if (!started) {  
                          ScaffoldMessenger.of(context)  
                              .showSnackBar(const SnackBar(  
                            content: Text(  
                                'Cannot start Web Authentication Session!'),  
                          ));  
                        }  
                      },  
                      child: const Text("Start Web Auth Session")),  
                ),  
          session == null  
              ? Container()  
              : Center(  
                  child: ElevatedButton(  
                      onPressed: () async {  
                        await session?.dispose();  
                        setState(() {  
                          token = null;  
                          session = null;  
                        });  
                      },  
                      child: const Text("Dispose Web Auth Session")),  
                )  
        ]));  
  }  
}  

```

--------------------------------

### Initialize InAppWebView with Windows and Android setup

Source: https://inappwebview.dev/docs/webview/in-app-webview

Basic usage example for initializing InAppWebView on Windows and Android, covering WebView2 runtime check and creation of WebViewEnvironment with custom user data folder, plus enabling web contents debugging on Android.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
import 'package:url_launcher/url_launcher.dart';  
  
WebViewEnvironment? webViewEnvironment;  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.windows) {  
    final availableVersion = await WebViewEnvironment.getAvailableVersion();  
    assert(availableVersion != null,  
        'Failed to find an installed WebView2 Runtime or non-stable Microsoft Edge installation.');  
  
    webViewEnvironment = await WebViewEnvironment.create(  
        settings: WebViewEnvironmentSettings(userDataFolder: 'YOUR_CUSTOM_PATH'));  
  }  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  InAppWebViewController? webViewController;  
  InAppWebViewSettings settings = InAppWebViewSettings(  
      isInspectable: kDebugMode,  
      mediaPlaybackRequiresUserGesture: false,  
      allowsInlineMediaPlayback: true,  
      iframeAllow: "camera; microphone",  
      iframeAllowFullscreen: true);  
  
  PullToRefreshController? pullToRefreshController;  
  String url = "";  
  double progress = 0;  
  final urlController = TextEditingController();  
  
  @override  
  void initState() {  
    super.initState();  
  
    pullToRefreshController = kIsWeb ||  
            ![TargetPlatform.iOS, TargetPlatform.android]  
                .contains(defaultTargetPlatform)  
        ? null  
        : PullToRefreshController(  
            settings: PullToRefreshSettings(  
              color: Colors.blue,  
            ),  
            onRefresh: () async {  
              if (defaultTargetPlatform == TargetPlatform.android) {  
                webViewController?.reload();  
              } else if (defaultTargetPlatform == TargetPlatform.iOS) {  
                webViewController?.loadUrl(  
                    urlRequest:  
```

--------------------------------

### Basic WebViewAssetLoader with AssetsPathHandler

Source: https://inappwebview.dev/docs/webview/webview-asset-loader

Basic setup for loading Android assets via http(s):// URLs. Uses the default domain appassets.androidplatform.net and HTTPS only. The path must start and end with '/' and not collide with a real web path.

```dart
InAppWebViewSettings settings = InAppWebViewSettings(  
  webViewAssetLoader: WebViewAssetLoader(  
    pathHandlers: [  
      AssetsPathHandler(path: '/assets/')  
    ]  
  )  
);  

```

--------------------------------

### Full Print Job Controller example

Source: https://inappwebview.dev/docs/webview/print-job-controller

Full example from the Print Job Controller documentation. Creates a print job with monochrome, grayscale, landscape settings)Skip, handles completion on iOS, and gets job info. Includes dispose in both the state's dispose and before creating a new print job.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  InAppWebViewController? webViewController;  
  InAppWebViewSettings settings =  
      InAppWebViewSettings(isInspectable: kDebugMode);  
  PrintJobController? printJobController;  
  
  @override  
  void dispose() {  
    // dispose any print job  
    printJobController?.dispose();  
    super.dispose();  
  }  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
        appBar: AppBar(  
          title: const Text('Print Job Controller'),  
          actions: [  
            IconButton(  
                onPressed: () async {  
                  // dispose any previous print job  
                  printJobController?.dispose();  
  
                  final jobSettings = PrintJobSettings(  
                      handledByClient: true,  
                      jobName:  
                          "${await webViewController?.getTitle() ?? ''} - PDF Document example",  
                      colorMode: PrintJobColorMode.MONOCHROME,  
                      outputType: PrintJobOutputType.GRAYSCALE,  
                      orientation: PrintJobOrientation.LANDSCAPE,  
                      numberOfPages: 1);  
  
                  printJobController = await webViewController  
                      ?.printCurrentPage(settings: jobSettings);  
  
                  if (defaultTargetPlatform == TargetPlatform.iOS) {  
                    printJobController?.onComplete = (completed, error) async {  
                      if (completed) {  
                        print("Print Job Completed");  
                      } else {  
                        print("Print Job Failed $error");  
                      }  
                      printJobController?.dispose();  
                    };  
                  }  
  
                  final jobInfo = await printJobController?.getInfo();  
                  print(jobInfo);  
                },  
                icon: const Icon(Icons.print))  
          ],  
        ),  
        body: Column(children: <Widget>[  
          Expanded(  
              child: InAppWebView(  
            key: webViewKey,  
            initialUrlRequest:  
                URLRequest(url: WebUri("https://github.com/flutter/")),  
            initialSettings: settings,  
            onWebViewCreated: (InAppWebViewController controller) {  
              webViewController = controller;  
            },  
          )),  
        ]));  
  }  
}  

```

--------------------------------

### Flutter app with JavaScript handlers

Source: https://inappwebview.dev/docs/webview/javascript/communication

Complete Flutter example showing how to set up an InAppWebView, register JavaScript handlers with `addJavaScriptHandler`, and call them from JavaScript using `window.flutter_inappwebview.callHandler`. The example includes platform-specific setup for Windows and Android, and demonstrates returning data from Flutter to JavaScript.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
WebViewEnvironment? webViewEnvironment;  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.windows) {  
    final availableVersion = await WebViewEnvironment.getAvailableVersion();  
    assert(availableVersion != null,  
    'Failed to find an installed WebView2 Runtime or non-stable Microsoft Edge installation.');  
  
    webViewEnvironment = await WebViewEnvironment.create(  
        settings:  
        WebViewEnvironmentSettings(userDataFolder: 'YOUR_CUSTOM_PATH'));  
  }  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(new MyApp());  
}  
  
class MyApp extends StatefulWidget {  
  @override  
  _MyAppState createState() => new _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  InAppWebViewSettings settings = InAppWebViewSettings(  
      isInspectable: kDebugMode,  
      mediaPlaybackRequiresUserGesture: false,  
      allowsInlineMediaPlayback: true,  
      iframeAllow: "camera; microphone",  
      iframeAllowFullscreen: true);  
  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: Scaffold(  
          appBar: AppBar(title: Text("JavaScript Handlers")),  
          body: SafeArea(  
              child: Column(children: <Widget>[  
                Expanded(  
                  child: InAppWebView(  
                    webViewEnvironment: webViewEnvironment,  
                    initialData: InAppWebViewInitialData(data: """  
<!DOCTYPE html>  
<html lang="en">  
    <head>  
        <meta charset="UTF-8">  
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">  
    </head>  
    <body>  
        <h1>JavaScript Handlers</h1>  
        <script>  
            window.addEventListener("flutterInAppWebViewPlatformReady", function(event) {  
                window.flutter_inappwebview.callHandler('handlerFoo')  
                  .then(function(result) {  
                    // print to the console the data coming  
                    // from the Flutter side.  
                    console.log(JSON.stringify(result));  
  
                    window.flutter_inappwebview  
                      .callHandler('handlerFooWithArgs', 1, true, ['bar', 5], {foo: 'baz'}, result);  
                });  
            });  
        </script>  
    </body>  
</html>  
                      """),  
                    initialSettings: settings,  
                    onWebViewCreated: (controller) {  
                      controller.addJavaScriptHandler(  
                          handlerName: 'handlerFoo',  
                          callback: (JavaScriptHandlerFunctionData data) {  
                            // return data to the JavaScript side!  
                            return {'bar': 'bar_value', 'baz': 'baz_value'};  
                          });  
  
                      controller.addJavaScriptHandler(  
                          handlerName: 'handlerFooWithArgs',  
                          callback: (JavaScriptHandlerFunctionData data) {  
                            print(data);  
                            // it will print:  
                            // JavaScriptHandlerFunctionData{args: [1, true, [bar, 5], {foo: baz}, {bar: bar_value, baz: baz_value}], isMainFrame: true, origin: , requestUrl: about:blank}  
                          });  
                    },  
                    onConsoleMessage: (controller, consoleMessage) {  
                      print(consoleMessage);  
                      // it will print: {message: {"bar":"bar_value","baz":"baz_value"}, messageLevel: 1}  
                    },  
                  ),  
                ),  
              ]))),  
    );  
  }  
}  

```

--------------------------------

### InAppLocalhostServer.start

Source: https://inappwebview.dev/docs/in-app-localhost-server

Starts the localhost server on the specified port. The default port is 8080. This method is asynchronous and should be awaited.

```APIDOC
## InAppLocalhostServer.start

### Description
Starts the localhost server on the specified port. The default port is 8080.

### Method
start()

### Parameters
None explicitly documented.

### Request Example
dart
await localhostServer.start();


### Response
No response body documented.
```

--------------------------------

### Basic InAppWebView with DevTools Protocol

Source: https://inappwebview.dev/docs/chrome-devtools-protocol

Complete Flutter app example showing basic InAppWebView usage with DevTools Protocol integration. It initializes a WebViewEnvironment on Windows, enables debugging on Android, and sets up an InAppWebView with navigation controls and a progress indicator. The example demonstrates calling the 'Page.enable' DevTools method and listening for the 'Page.loadEventFired' event.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
WebViewEnvironment? webViewEnvironment;  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.windows) {  
    final availableVersion = await WebViewEnvironment.getAvailableVersion();  
    assert(availableVersion != null,  
    'Failed to find an installed WebView2 Runtime or non-stable Microsoft Edge installation.');  
  
    webViewEnvironment = await WebViewEnvironment.create(  
        settings:  
        WebViewEnvironmentSettings(userDataFolder: 'YOUR_CUSTOM_PATH'));  
  }  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  InAppWebViewController? webViewController;  
  InAppWebViewSettings settings = InAppWebViewSettings(  
      isInspectable: kDebugMode,  
      mediaPlaybackRequiresUserGesture: false,  
      allowsInlineMediaPlayback: true,  
      iframeAllow: "camera; microphone",  
      iframeAllowFullscreen: true);  
  
  double progress = 0;  
  
  @override  
  void initState() {  
    super.initState();  
  }  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
        appBar: AppBar(title: const Text("Official InAppWebView website")),  
        body: SafeArea(  
            child: Column(children: <Widget>[  
              Expanded(  
                child: Stack(  
                  children: [  
                    InAppWebView(  
                      key: webViewKey,  
                      webViewEnvironment: webViewEnvironment,  
                      initialSettings: settings,  
                      onWebViewCreated: (controller) async {  
                        webViewController = controller;  
  
                        // Prepare DevTools Protocol  
                        if (!kIsWeb &&  
                            defaultTargetPlatform == TargetPlatform.windows) {  
                          // Enables page domain notifications.  
                          await controller.callDevToolsProtocolMethod(  
                              methodName: 'Page.enable');  
                          // Listen for a Page event  
                          await controller.addDevToolsProtocolEventListener(  
                            eventName: 'Page.loadEventFired',  
                            callback: (data) {  
                              print('Page.loadEventFired: $data');  
                            },  
                          );  
                        }  
  
                        // Load your URL  
                        await controller.loadUrl(  
                            urlRequest: URLRequest(  
                                url: WebUri("https://inappwebview.dev/")));  
                      },  
                      onProgressChanged: (controller, progress) {  
                        setState(() {  
                          this.progress = progress / 100;  
                        });  
                      },  
                    ),  
                    progress < 1.0  
                        ? LinearProgressIndicator(value: progress)  
                        : Container(),  
                  ],  
                ),  
              ),  
              ButtonBar(  
                alignment: MainAxisAlignment.center,  
                children: <Widget>[  
                  ElevatedButton(  
                    child: const Icon(Icons.arrow_back),  
                    onPressed: () {  
                      webViewController?.goBack();  
                    },  
                  ),  
                  ElevatedButton(  
                    child: const Icon(Icons.arrow_forward),  
                    onPressed: () {  
                      webViewController?.goForward();  
                    },  
                  ),  
                  ElevatedButton(  
                    child: const Icon(Icons.refresh),  
                    onPressed: () {  
                      webViewController?.reload();  
                    },  
                  ),  
                ],  
              ),  
            ])));  
  }  
}  

```

--------------------------------

### WebStorageManager Usage Examples

Source: https://inappwebview.dev/docs/web-storage-manager

Code snippets demonstrating the usage of the WebStorageManager singleton instance and its methods for managing web storage data.

```APIDOC
## WebStorageManager.instance()

### Description
Returns the shared singleton instance of the WebStorageManager class, which manages web storage used by WebView instances.

### Method
instance()

### Parameters
None

### Return Value
- **WebStorageManager** - The shared instance of the WebStorageManager.

### Example
```dart
WebStorageManager webStorageManager = WebStorageManager.instance();
```
```

```APIDOC
## WebStorageManager.deleteAllData()

### Description
Deletes all web storage data. Supported on Android only.

### Method
deleteAllData()

### Parameters
None

### Return Value
- **Future<void>** - A future that completes when the operation is finished.

### Example
```dart
await webStorageManager.deleteAllData();
```
```

```APIDOC
## WebStorageManager.fetchDataRecords()

### Description
Fetches the data records stored by the web storage. Supported on iOS and macOS.

### Method
fetchDataRecords({required List<WebsiteDataType> dataTypes})

### Parameters
- **dataTypes** (List<WebsiteDataType>) - Required - The types of website data to fetch.

### Return Value
- **Future<List<WebsiteDataRecord>>** - A future that completes with a list of website data records.

### Example
```dart
var records = await webStorageManager.fetchDataRecords(dataTypes: WebsiteDataType.values);
```
```

```APIDOC
## WebStorageManager.removeDataFor()

### Description
Removes specified data records for the given data types. Supported on iOS and macOS.

### Method
removeDataFor({required List<WebsiteDataType> dataTypes, required List<WebsiteDataRecord> dataRecords})

### Parameters
- **dataTypes** (List<WebsiteDataType>) - Required - The types of website data to remove.
- **dataRecords** (List<WebsiteDataRecord>) - Required - The specific data records to remove.

### Return Value
- **Future<void>** - A future that completes when the operation is finished.

### Example
```dart
await webStorageManager.removeDataFor(dataTypes: WebsiteDataType.values, dataRecords: recordsToDelete);
```
```

--------------------------------

### Start InAppLocalhostServer and load index.html in InAppWebView

Source: https://inappwebview.dev/docs/in-app-localhost-server

Starts an InAppLocalhostServer on port 8080 serving the 'assets' directory and loads its index.html in an InAppWebView. The server is started only on non-web platforms, and web contents debugging is enabled on Android in debug mode.

```dart
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
final InAppLocalhostServer localhostServer =  
    InAppLocalhostServer(documentRoot: 'assets');  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb) {  
    // start the localhost server  
    await localhostServer.start();  
  }  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: const Text('InAppLocalhostServer Example'),  
      ),  
      body: Container(  
          child: Column(children: <Widget>[  
        Expanded(  
          child: InAppWebView(  
            initialSettings: InAppWebViewSettings(  
              isInspectable: kDebugMode,  
            ),  
            initialUrlRequest:  
                URLRequest(url: WebUri("http://localhost:8080/index.html")),  
            onWebViewCreated: (controller) {},  
            onLoadStart: (controller, url) {},  
            onLoadStop: (controller, url) {},  
          ),  
        )  
      ])),  
    );  
  }  
}  

```

--------------------------------

### WebUri Class

Source: https://inappwebview.dev/docs/web-uri

Documentation for the WebUri class, including its constructor, properties, methods, and usage examples.

```APIDOC
## WebUri Class

### Description
`WebUri` is a class that implements the `Uri` interface to maintain also the raw string value used by `Uri.parse`. It is used because some strings coming from the native platform side are not parsed correctly or could lose letter case information, so `rawValue` can be used as a fallback value.

### Constructor
- **WebUri(String rawValue, {bool forceToStringRawValue = false})** - Creates a `WebUri` instance with the given raw string value and an optional flag to force the usage of `rawValue` when calling `toString`.

### Properties
- **rawValue** (String) - The raw string value used by `Uri.parse`.
- **forceToStringRawValue** (bool) - Indicates whether to force the usage of `rawValue` when calling `toString`. The default value is `false`.
- **isValidUri** (bool) - Detects if `rawValue` has been parsed correctly. If it is `false`, then `uriValue` will have the value of `Uri()`.
- **uriValue** (Uri) - The parsed `Uri` object. If `isValidUri` is `false`, it will be `Uri()`.

### Methods
- **toString()** - Returns `rawValue` if `forceToStringRawValue` is `true` or `isValidUri` is `false`, otherwise returns `uriValue.toString()`.

### Example
```dart
// InAppWebView example  
InAppWebView(  
  initialUrlRequest:  
    URLRequest(url: WebUri('https://flutter.dev'))  
)  
  
// example of letter case difference  
final uri = WebUri('scheme://customHostValue', forceToStringRawValue: false);  
print(uri.rawValue); // scheme://customHostValue  
print(uri.isValidUri); // true  
print(uri.uriValue.toString()); // scheme://customhostvalue  
print(uri.toString()); // scheme://customhostvalue  
  
uri.forceToStringRawValue = true;  
print(uri.toString()); // scheme://customHostValue  
  
// example of a not valid URI  
// Uncaught Error: FormatException: Invalid port (at character 14)  
final invalidUri = WebUri('intent://not:valid_uri');  
print(invalidUri.rawValue); // intent://not:valid_uri  
print(invalidUri.isValidUri); // false  
print(invalidUri.uriValue.toString()); // ''  
print(invalidUri.toString()); // intent://not:valid_uri  
```
```

--------------------------------

### Flutter FindInteractionController basic usage example

Source: https://inappwebview.dev/docs/webview/find-interaction-controller

Complete Flutter example showing how to set up a FindInteractionController with an onFindResultReceived callback, display match counts, show a snackbar when no matches are found, and toggle the iOS native find navigator via presentFindNavigator/dismissFindNavigator. The code is truncated at the end in the source.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  InAppWebViewController? webViewController;  
  InAppWebViewSettings settings = InAppWebViewSettings();  
  late FindInteractionController findInteractionController;  
  final searchController = TextEditingController();  
  var textFound = "";  
  
  @override  
  void initState() {  
    super.initState();  
  
    findInteractionController = FindInteractionController(  
      onFindResultReceived: (controller, activeMatchOrdinal, numberOfMatches,  
          isDoneCounting) async {  
        if (isDoneCounting) {  
          setState(() {  
            textFound = numberOfMatches > 0  
                ? '${activeMatchOrdinal + 1} of $numberOfMatches'  
                : '';  
          });  
          if (numberOfMatches == 0) {  
            ScaffoldMessenger.of(context).showSnackBar(SnackBar(  
              content: Text(  
                  'No matches found for "${await findInteractionController.getSearchText()}"'),  
            ));  
          }  
        }  
      },  
    );  
  }  
  
  @override  
  Widget build(BuildContext context) {  
    var isFindInteractionEnabled = settings.isFindInteractionEnabled ?? false;  
  
    return Scaffold(  
        appBar: AppBar(  
            title: const Text('Find Interaction Controller'),  
            actions: defaultTargetPlatform != TargetPlatform.iOS  
                ? []  
                : [  
                    (isFindInteractionEnabled)  
                        ? IconButton(  
                            icon: const Icon(Icons.search),  
                            onPressed: () async {  
                              if (await findInteractionController  
                                      .isFindNavigatorVisible() ??  
                                  false) {  
                                await findInteractionController  
                                    .dismissFindNavigator();  
                              } else {  
                                await findInteractionController  
                                    .presentFindNavigator();  
                              }  
                            },  
                          )  
                        : Container(),  
                    TextButton(  
                      style:  
                          TextButton.styleFrom(foregroundColor: Colors.white),  
                      onPressed: () async {  
                        if (isFindInteractionEnabled) {  
                          searchController.text =  
                              await findInteractionController.getSearchText() ??  
                                  '';  
                        }  
                        await findInteractionController.clearMatches();  
                        isFindInteractionEnabled =  
                            settings.isFindInteractionEnabled =
```

--------------------------------

### HeadlessInAppWebView Basic Usage Example

Source: https://inappwebview.dev/docs/webview/headless-in-app-webview

Creates a HeadlessInAppWebView that loads a URL, listens to lifecycle events, and provides buttons to run, send a console message, and dispose the webview. Requires Flutter and the flutter_inappwebview package.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  HeadlessInAppWebView? headlessWebView;  
  String url = "";  
  
  @override  
  void initState() {  
    super.initState();  
  
    headlessWebView = HeadlessInAppWebView(  
      initialUrlRequest: URLRequest(url: WebUri("https://github.com/flutter")),  
      initialSettings: InAppWebViewSettings(isInspectable: kDebugMode),  
      onWebViewCreated: (controller) {  
        const snackBar = SnackBar(  
          content: Text('HeadlessInAppWebView created!'),  
          duration: Duration(seconds: 1),  
        );  
        ScaffoldMessenger.of(context).showSnackBar(snackBar);  
      },  
      onConsoleMessage: (controller, consoleMessage) {  
        final snackBar = SnackBar(  
          content: Text('Console Message: ${consoleMessage.message}'),  
          duration: const Duration(seconds: 1),  
        );  
        ScaffoldMessenger.of(context).showSnackBar(snackBar);  
      },  
      onLoadStart: (controller, url) async {  
        final snackBar = SnackBar(  
          content: Text('onLoadStart $url'),  
          duration: const Duration(seconds: 1),  
        );  
        ScaffoldMessenger.of(context).showSnackBar(snackBar);  
  
        setState(() {  
          this.url = url?.toString() ?? '';  
        });  
      },  
      onLoadStop: (controller, url) async {  
        final snackBar = SnackBar(  
          content: Text('onLoadStop $url'),  
          duration: const Duration(seconds: 1),  
        );  
        ScaffoldMessenger.of(context).showSnackBar(snackBar);  
  
        setState(() {  
          this.url = url?.toString() ?? '';  
        });  
      },  
    );  
  }  
  
  @override  
  void dispose() {  
    super.dispose();  
    headlessWebView?.dispose();  
  }  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
        appBar: AppBar(  
            title: const Text(  
          "HeadlessInAppWebView Example",  
        )),  
        body: SafeArea(  
            child: Column(children: <Widget>[  
          Container(  
            padding: const EdgeInsets.all(20.0),  
            child: Text(  
                "URL: ${(url.length > 50) ? "${url.substring(0, 50)}..." : url}"),  
          ),  
          Center(  
            child: ElevatedButton(  
                onPressed: () async {  
                  await headlessWebView?.dispose();  
                  await headlessWebView?.run();  
                },  
                child: const Text("Run HeadlessInAppWebView")),  
          ),  
          Center(  
            child: ElevatedButton(  
                onPressed: () async {  
                  if (headlessWebView?.isRunning() ?? false) {  
                    await headlessWebView?.webViewController  
                        ?.evaluateJavascript(  
                            source: "console.log('Here is the message!');");  
                  } else {  
                    const snackBar = SnackBar(  
                      content: Text(  
                          'HeadlessInAppWebView is not running. Click on "Run HeadlessInAppWebView"!'),  
                      duration: Duration(milliseconds: 1500),  
                    );  
                    ScaffoldMessenger.of(context).showSnackBar(snackBar);  
                  }  
                },  
                child: const Text("Send console.log message")),  
          ),  
          Center(  
            child: ElevatedButton(  
                onPressed: () {  
                  headlessWebView?.dispose();  
                  setState(() {  
                    url = '';  
                  });  
                },  
                child: const Text("Dispose HeadlessInAppWebView")),  
          )  
        ])));  
  }  
}  

```

--------------------------------

### Handle custom scheme with onLoadResourceWithCustomScheme

Source: https://inappwebview.dev/docs/webview/in-app-webview

Complete example of handling a custom scheme with onLoadResourceWithCustomScheme. On Windows, it creates a WebViewEnvironment with customSchemeRegistrations; on other platforms, it uses InAppWebViewSettings.resourceCustomSchemes. The event loads a resource from assets and returns a CustomSchemeResponse with base64-encoded data.

```dart
import 'package:flutter/services.dart';  
  
WebViewEnvironment? webViewEnvironment;  
  
Future main() async {  
  
  //...  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.windows) {  
    final availableVersion = await WebViewEnvironment.getAvailableVersion();  
    assert(availableVersion != null,  
        'Failed to find an installed WebView2 Runtime or non-stable Microsoft Edge installation.');  
  
    webViewEnvironment = await WebViewEnvironment.create(  
        settings: WebViewEnvironmentSettings(  
            userDataFolder: 'YOUR_CUSTOM_PATH',  
            customSchemeRegistrations: [  
          CustomSchemeRegistration(  
              scheme: "my-special-custom-scheme",  
              allowedOrigins: ['*'],  
              treatAsSecure: true,  
              hasAuthorityComponent: true)  
        ]));  
  }  
  
  //...  
}  
  
//...  
  
InAppWebView(  
  webViewEnvironment: webViewEnvironment,  
  initialUrlRequest: URLRequest(url: WebUri('https://example.com')),  
  initialSettings: InAppWebViewSettings(resourceCustomSchemes: ["my-special-custom-scheme"]),  
  onLoadResourceWithCustomScheme: (controller, request) async {  
    if (request.url.scheme == "my-special-custom-scheme") {  
      final bytes = await rootBundle.load(  
          "assets/${request.url.toString().replaceFirst("my-special-custom-scheme://", "", 0)}");  
      final response = CustomSchemeResponse(  
          data: bytes.buffer.asUint8List(),  
          contentType: "image/svg+xml",  
          contentEncoding: "utf-8");  
      return response;  
    }  
    return null;  
  },  
),  
```

--------------------------------

### Basic WebViewAssetLoader usage with custom domain

Source: https://inappwebview.dev/docs/webview/webview-asset-loader

Complete Flutter example that configures InAppWebView with a WebViewAssetLoader using a custom domain (my.custom.domain.com) and an AssetsPathHandler for '/assets/'. The HTML file is a Flutter asset at assets/website/index.html and is loaded via the custom domain URL.

```dart
import 'dart:async';  
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: MyApp()));  
}  
  
class MyApp extends StatefulWidget {  
  const MyApp({super.key});  
  
  @override  
  State<MyApp> createState() => _MyAppState();  
}  
  
class _MyAppState extends State<MyApp> {  
  final GlobalKey webViewKey = GlobalKey();  
  
  InAppWebViewSettings settings = InAppWebViewSettings(  
      isInspectable: kDebugMode,  
  
      // Setting this off for security. Off by default for SDK versions >= 16.  
      allowFileAccessFromFileURLs: false,  
      // Off by default, deprecated for SDK versions >= 30.  
      allowUniversalAccessFromFileURLs: false,  
  
      // Keeping these off is less critical but still a good idea, especially if your app is not  
      // using file:// or content:// URLs.  
      allowFileAccess: false,  
      allowContentAccess: false,  
  
      // Basic WebViewAssetLoader with custom domain  
      webViewAssetLoader: WebViewAssetLoader(  
          domain: "my.custom.domain.com",  
          pathHandlers: [AssetsPathHandler(path: '/assets/')]));  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
        appBar: AppBar(  
          title: const Text('WebView Asset Loader'),  
        ),  
        body: Column(children: <Widget>[  
          Expanded(  
              child: InAppWebView(  
            key: webViewKey,  
            initialUrlRequest: URLRequest(  
                url: WebUri(  
                    "https://my.custom.domain.com/assets/flutter_assets/assets/website/index.html")),  
            initialSettings: settings,  
          )),  
        ]));  
  }  
}  

```

```html
<!doctype html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport"  
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">  
    <meta http-equiv="X-UA-Compatible" content="ie=edge">  
    <title>WebViewAssetLoader</title>  
</head>  
<body>  
    <h1>WebViewAssetLoader</h1>  
    <p>This is a test.</p>  
</body>  
</html>  

```

--------------------------------

### Set HTTP auth credential with HttpAuthCredentialDatabase

Source: https://inappwebview.dev/docs/http-auth-credential-database

Retrieves the singleton HttpAuthCredentialDatabase instance and sets a credential for a protection space using setHttpAuthCredential. The example uses URLProtectionSpace with host, protocol, realm, and port, and URLCredential with username and password.

```dart
// get the HttpAuthCredentialDatabase instance  
HttpAuthCredentialDatabase httpAuthCredentialDatabase =  
          HttpAuthCredentialDatabase.instance();  
  
// set a HTTP auth credential for a particular Protection Space  
httpAuthCredentialDatabase.setHttpAuthCredential(  
  protectionSpace: URLProtectionSpace(  
      host: "example.com",  
      protocol: "http",  
      realm: "Realm",  
      port: 8081),  
  credential:  
      URLCredential(username: "USERNAME", password: "PASSWORD"));  

```

--------------------------------

### WebUri basic usage examples

Source: https://inappwebview.dev/docs/web-uri

Shows how to use WebUri in an InAppWebView, handle letter case differences with forceToStringRawValue, and handle invalid URIs. The default forceToStringRawValue is false, and toString returns rawValue when forceToStringRawValue is true or isValidUri is false.

```dart
// InAppWebView example  
InAppWebView(  
  initialUrlRequest:  
    URLRequest(url: WebUri('https://flutter.dev'))  
)  
  
// example of letter case difference  
final uri = WebUri('scheme://customHostValue', forceToStringRawValue: false);  
print(uri.rawValue); // scheme://customHostValue  
print(uri.isValidUri); // true  
print(uri.uriValue.toString()); // scheme://customhostvalue  
print(uri.toString()); // scheme://customhostvalue  
  
uri.forceToStringRawValue = true;  
print(uri.toString()); // scheme://customHostValue  
  
// example of a not valid URI  
// Uncaught Error: FormatException: Invalid port (at character 14)  
final invalidUri = WebUri('intent://not:valid_uri');  
print(invalidUri.rawValue); // intent://not:valid_uri  
print(invalidUri.isValidUri); // false  
print(invalidUri.uriValue.toString()); // ''  
print(invalidUri.toString()); // intent://not:valid_uri  
```

--------------------------------

### Android TWA browser with ChromeSafariBrowser

Source: https://inappwebview.dev/docs/in-app-browsers/chrome-safari-browser

Complete Flutter example that creates a ChromeSafariBrowser subclass for a Trusted Web Activity (TWA). It enables Android web contents debugging and opens the URL https://flutter.dev/ with isTrustedWebActivity: true; requires the strings.xml and manifest setup shown below to remove the URL bar.

```dart
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';

class AndroidTWABrowser extends ChromeSafariBrowser {
  @override
  void onOpened() {
    print("Android TWA browser opened");
  }

  @override
  void onCompletedInitialLoad(didLoadSuccessfully) {
    print("Android TWA browser initial load completed");
  }

  @override
  void onClosed() {
    print("Android TWA browser closed");
  }
}

Future main() async {
  WidgetsFlutterBinding.ensureInitialized();

  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {
    await InAppWebViewController.setWebContentsDebuggingEnabled(true);
  }

  runApp(MaterialApp(home: MyApp()));
}

class MyApp extends StatefulWidget {
  final ChromeSafariBrowser browser = new AndroidTWABrowser();

  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Android TWA Example'),
      ),
      body: Center(
        child: ElevatedButton(
            onPressed: () async {
              await widget.browser.open(
                url: WebUri("https://flutter.dev/"),
                settings:
                    ChromeSafariBrowserSettings(isTrustedWebActivity: true),
              );
            },
            child: Text("Open Android TWA Browser")),
      ),
    );
  }
}


```

--------------------------------

### Flutter example using InAppWebViewKeepAlive to share a WebView between two pages

Source: https://inappwebview.dev/docs/webview/keep-alive

Complete Flutter app with PageA and PageB that use the same InAppWebViewKeepAlive instance. The WebView is created on PageA with initial settings and URL, while PageB reuses the same keepAlive token to render the same native WebView without reloading. Includes Windows WebView2 environment setup and Android debugging enablement. Note: only one active InAppWebView can use the same keepAlive instance; using it for two active instances will crash.

```dart
import 'package:flutter/foundation.dart';  
import 'package:flutter/material.dart';  
import 'package:flutter_inappwebview/flutter_inappwebview.dart';  
  
WebViewEnvironment? webViewEnvironment;  
final keepAlive = InAppWebViewKeepAlive();  
  
Future main() async {  
  WidgetsFlutterBinding.ensureInitialized();  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.windows) {  
    final availableVersion = await WebViewEnvironment.getAvailableVersion();  
    assert(availableVersion != null,  
        'Failed to find an installed WebView2 Runtime or non-stable Microsoft Edge installation.');  
  
    webViewEnvironment = await WebViewEnvironment.create(  
        settings:  
            WebViewEnvironmentSettings(userDataFolder: 'YOUR_CUSTOM_PATH'));  
  }  
  
  if (!kIsWeb && defaultTargetPlatform == TargetPlatform.android) {  
    await InAppWebViewController.setWebContentsDebuggingEnabled(kDebugMode);  
  }  
  
  runApp(const MaterialApp(home: PageA()));  
}  
  
class PageA extends StatelessWidget {  
  const PageA({super.key});  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: const Text('Page A - Keep Alive Example'),  
        actions: [  
          ElevatedButton(  
              onPressed: () {  
                Navigator.of(context).pushReplacement(  
                  MaterialPageRoute(  
                    builder: (context) => const PageB(),  
                  ),  
                );  
              },  
              child: const Text('Go To Page B'))  
        ],  
      ),  
      body: Column(children: <Widget>[  
        Expanded(  
          child: InAppWebView(  
            webViewEnvironment: webViewEnvironment,  
            keepAlive: keepAlive,  
            initialUrlRequest:  
                URLRequest(url: WebUri("http://github.com/flutter")),  
            initialSettings: InAppWebViewSettings(  
              isInspectable: kDebugMode,  
            ),  
          ),  
        )  
      ]),  
    );  
  }  
}  
  
class PageB extends StatelessWidget {  
  const PageB({super.key});  
  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: const Text('Page B - Keep Alive Example'),  
        actions: [  
          ElevatedButton(  
              onPressed: () {  
                Navigator.of(context).pushReplacement(  
                  MaterialPageRoute(  
                    builder: (context) => const PageA(),  
                  ),  
                );  
              },  
              child: const Text('Go To Page A'))  
        ],  
      ),  
      body: Column(children: <Widget>[  
        Expanded(  
          child: InAppWebView(  
            keepAlive: keepAlive,  
          ),  
        )  
      ]),  
    );  
  }  
}  

```

--------------------------------

### InAppWebViewController.getJavaScriptBridgeName

Source: https://inappwebview.dev/docs/webview/javascript/communication

Gets the current JavaScript Bridge object name.

```APIDOC
## getJavaScriptBridgeName

### Description
Returns the current JavaScript Bridge object name.

### Method
`getJavaScriptBridgeName` (static Dart method)

### Return Value
- **String** - The current JavaScript Bridge name.

### Example (Dart)
```dart
String name = await InAppWebViewController.getJavaScriptBridgeName();
```

```
Tokens:
Raw