Skip to main content

WebView

Display web content in a WebView to be shown in your Flet apps.

It is powered by the webview_flutter and webview_flutter_web Flutter packages.

Platform Support​

PlatformWindowsmacOSLinuxiOSAndroidWeb
Supported❌✅❌✅✅✅

Usage​

Add flet-webview to your project dependencies:

uv add flet-webview

Example​

import flet as ft
import flet_webview as fwv


def main(page: ft.Page):
    page.add(
        ft.SafeArea(
            expand=True,
            content=fwv.WebView(
                url="https://flet.dev",
                on_page_started=lambda _: print("Page started"),
                on_page_ended=lambda _: print("Page ended"),
                on_web_resource_error=lambda e: print("WebView error:", e.data),
                expand=True,
            ),
        )
    )


if __name__ == "__main__":
    ft.run(main)

Troubleshooting​

NET::ERR_CLEARTEXT_NOT_PERMITTED Error​

If you run into the NET::ERR_CLEARTEXT_NOT_PERMITTED error in Android, then the app you’re using is trying to access a web page that wants to transmit cleartext or unsecured information. Android blocks apps from doing this in order to avoid compromising user data.

For more details, see this and this.

To fix it, your app's configuration (precisely, the manifest application attributes) needs to be modified as follows:

[tool.flet.android.manifest_application]
usesCleartextTraffic = "true"

Description​

Easily load webpages while allowing user interaction.

Note

Supported only on the following platforms: iOS, Android, macOS, and Web. Concerning Windows and Linux support, subscribe to this issue.

Inherits: LayoutControl

Properties

  • bgcolor - Defines the background color of the WebView.
  • prevent_links - List of url-prefixes that should not be followed/loaded/downloaded.
  • url - The URL of the web page to load.

Events

  • on_console_message - Fires when a log message is written to the JavaScript console.
  • on_javascript_alert_dialog - Fires when the web page attempts to display a JavaScript alert() dialog.
  • on_page_ended - Fires when all the webview page loading processes are ended.
  • on_page_started - Fires soon as the first loading process of the webview page is started.
  • on_progress - Fires when the progress of the webview page loading is changed.
  • on_scroll - Fires when the web page's scroll position changes.
  • on_url_change - Fires when the URL of the webview page is changed.
  • on_web_resource_error - Fires when there is error with loading a webview page resource.

Methods

Properties​

bgcolorclass-attributeinstance-attribute​

bgcolor: Optional[ColorValue] = None

Defines the background color of the WebView.

prevent_links: Optional[list[str]] = None

List of url-prefixes that should not be followed/loaded/downloaded.

urlclass-attributeinstance-attribute​

url: Optional[str] = None

The URL of the web page to load.

Events​

on_console_messageclass-attributeinstance-attribute​

on_console_message: Optional[EventHandler[WebViewConsoleMessageEvent]] = None

Fires when a log message is written to the JavaScript console.

Note

Works only on the following platforms: iOS, Android and macOS.

on_javascript_alert_dialogclass-attributeinstance-attribute​

on_javascript_alert_dialog: Optional[EventHandler[WebViewJavaScriptEvent]] = None

Fires when the web page attempts to display a JavaScript alert() dialog.

Note

Works only on the following platforms: iOS, Android and macOS.

on_page_endedclass-attributeinstance-attribute​

on_page_ended: Optional[ControlEventHandler[WebView]] = None

Fires when all the webview page loading processes are ended.

The data property of the event handler argument is of type str and contains the URL.

Note

Works only on the following platforms: iOS, Android and macOS.

on_page_startedclass-attributeinstance-attribute​

on_page_started: Optional[ControlEventHandler[WebView]] = None

Fires soon as the first loading process of the webview page is started.

The data property of the event handler argument is of type str and contains the URL.

Note

Works only on the following platforms: iOS, Android and macOS.

on_progressclass-attributeinstance-attribute​

on_progress: Optional[ControlEventHandler[WebView]] = None

Fires when the progress of the webview page loading is changed.

The data property of the event handler argument is of type int and contains the progress value.

Note

Works only on the following platforms: iOS, Android and macOS.

on_scrollclass-attributeinstance-attribute​

on_scroll: Optional[EventHandler[WebViewScrollEvent]] = None

Fires when the web page's scroll position changes.

Note

Works only on the following platforms: iOS and Android.

on_url_changeclass-attributeinstance-attribute​

on_url_change: Optional[ControlEventHandler[WebView]] = None

Fires when the URL of the webview page is changed.

The data property of the event handler argument is of type str and contains the new URL.

Note

Works only on the following platforms: iOS, Android and macOS.

on_web_resource_errorclass-attributeinstance-attribute​

on_web_resource_error: Optional[ControlEventHandler[WebView]] = None

Fires when there is error with loading a webview page resource.

The data property of the event handler argument is of type str and contains the error message.

Note

Works only on the following platforms: iOS, Android and macOS.

Methods​

can_go_backasync​

can_go_back()

Whether there's a back history item.

Note

Works only on the following platforms: iOS, Android, and macOS.

Returns:

  • bool - True if there is a back history item, False otherwise.

can_go_forwardasync​

can_go_forward()

Whether there's a forward history item.

Note

Works only on the following platforms: iOS, Android, and macOS.

Returns:

  • bool - True if there is a forward history item, False otherwise.

clear_cacheasync​

clear_cache()

Clears all caches used by the WebView.

The following caches are cleared:

  • Browser HTTP Cache
  • Cache API caches. Service workers tend to use this cache.
  • Application cache
Note

Works only on the following platforms: iOS, Android, and macOS.

clear_local_storageasync​

clear_local_storage()

Clears the local storage used by the WebView.

Note

Works only on the following platforms: iOS, Android, and macOS.

disable_zoomasync​

disable_zoom()

Disables zooming using the on-screen zoom controls and gestures.

Note

Works only on the following platforms: iOS, Android, and macOS.

enable_zoomasync​

enable_zoom()

Enables zooming using the on-screen zoom controls and gestures.

Note

Works only on the following platforms: iOS, Android, and macOS.

get_current_urlasync​

get_current_url()

Gets the current URL that the WebView is displaying or None if no URL was ever loaded.

Note

Works only on the following platforms: iOS, Android, and macOS.

Returns:

  • Optional[str] - The current URL that the WebView is displaying or None if no URL was ever loaded.

get_titleasync​

get_title()

Get the title of the currently loaded page.

Note

Works only on the following platforms: iOS, Android, and macOS.

Returns:

  • Optional[str] - The title of the currently loaded page.

get_user_agentasync​

get_user_agent()

Get the value used for the HTTP User-Agent: request header.

Note

Works only on the following platforms: iOS, Android, and macOS.

Returns:

  • Optional[str] - The value used for the HTTP User-Agent: request header.

go_backasync​

go_back()

Goes back in the history of the webview, if can_go_back() is True.

Note

Works only on the following platforms: iOS, Android, and macOS.

go_forwardasync​

go_forward()

Goes forward in the history of the webview, if can_go_forward is True.

Note

Works only on the following platforms: iOS, Android, and macOS.

load_fileasync​

load_file(path: str)

Loads the provided local file.

Note

Works only on the following platforms: iOS, Android, and macOS.

Parameters:

  • path (str) - The absolute path to the file.

load_htmlasync​

load_html(value: str, base_url: Optional[str] = None)

Loads the provided HTML string.

Note

Works only on the following platforms: iOS, Android, and macOS.

Parameters:

  • value (str) - The HTML string to load.
  • base_url (Optional[str], default: None) - The base URL to use when resolving relative URLs within the value.

load_requestasync​

load_request(url: str, method: RequestMethod = RequestMethod.GET)

Makes an HTTP request and loads the response in the webview.

Parameters:

  • url (str) - The URL to load.
  • method (RequestMethod, default: RequestMethod.GET) - The HTTP method to use.
Note

Works only on the following platforms: iOS, Android, and macOS.

reloadasync​

reload()

Reloads the current URL.

Note

Works only on the following platforms: iOS, Android, and macOS.

run_javascriptasync​

run_javascript(value: str)

Runs the given JavaScript in the context of the current page.

Parameters:

  • value (str) - The JavaScript code to run.
Note

Works only on the following platforms: iOS, Android, and macOS.

scroll_byasync​

scroll_by(x: int, y: int)

Scrolls by the provided number of webview pixels.

Note

Works only on the following platforms: iOS, Android, and macOS.

Parameters:

  • x (int) - The number of pixels to scroll by on the x-axis.
  • y (int) - The number of pixels to scroll by on the y-axis.

scroll_toasync​

scroll_to(x: int, y: int)

Scrolls to the provided position of webview pixels.

Note

Works only on the following platforms: iOS, Android, and macOS.

Parameters:

  • x (int) - The x-coordinate of the scroll position.
  • y (int) - The y-coordinate of the scroll position.

set_javascript_modeasync​

set_javascript_mode(mode: JavaScriptMode)

Sets the JavaScript mode of the WebView.

Note
  • Works only on the following platforms: iOS, Android, and macOS.
  • Disabling the JavaScript execution on the page may result to unexpected web page behaviour.

Parameters:

  • mode (JavaScriptMode) - The JavaScript mode to set.