Keep Alive

Supported Platforms: AndroidiOSmacOSWindows

This feature is used to keep alive a native WebView in background instead of disposing it when the corresponding InAppWebView Flutter widget is removed from the widget tree.

InAppWebViewKeepAlive represents a token to be used by the InAppWebView.keepAlive property. Once the InAppWebView is created for the first time on the native platform side, all the other InAppWebView widgets that will use the same InAppWebViewKeepAlive instance will render the same native WebView with the same settings.

There could be only one active InAppWebView instance per InAppWebViewKeepAlive instance. Trying to use the same InAppWebViewKeepAlive instance for two active InAppWebView s will result in a crash.

Basic Usage

Here is an example using the same InAppWebViewKeepAlive to render the same WebView inside two different pages. When you go from Page A to Page B or vice-versa, the InAppWebView will render the same native WebView without reloading and maintaining the current WebView native state (current url, scroll position, ecc...), as if you never removed it from the Flutter widget tree.

Example:

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,
          ),
        )
      ]),
    );
  }
}

This is the result:

Android