How to use event onLoadResourceCustomScheme

[rathanak]

Hi ,
I got stuck with onLoadResourceCustomScheme event , how to declare it in webview option ? and how to call to use it in event ?

[pichillilorenzo]

Here is an example.

You need first declare what custom schemes you need to intercept using the resourceCustomSchemes option:

initialOptions: InAppWebViewGroupOptions(
    crossPlatform: InAppWebViewOptions(
      debuggingEnabled: true,
      resourceCustomSchemes: ["my-special-custom-scheme"]
    )
),

Then, in the onLoadResourceCustomScheme event you can intercept it and return your CustomSchemeResponse:

onLoadResourceCustomScheme: (InAppWebViewController controller, String scheme, String url) async {
  if (scheme == "my-special-custom-scheme") {
    var bytes = await rootBundle.load("test_assets/" + url.replaceFirst("my-special-custom-scheme://", "", 0));
    var response = CustomSchemeResponse(data: bytes.buffer.asUint8List(), contentType: "image/svg+xml", contentEnconding: "utf-8");
    return response;
  }
  return null;
},

In my example, I'm simply reading an asset file from the test_assets/ folder using rootBundle (import 'package:flutter/services.dart';) and return the new asset to the WebView.

In my test HTML I have:

<img id="image" src="my-special-custom-scheme://images/flutter-logo.svg" alt="flutter logo">

that will be intercepted by the onLoadResourceCustomScheme event.