Flutter Enable Disable JavaScript in WebView Example Tutorial

Flutter’s official WebView plugin comes with an amazing feature which is called enabling and disabling JavaScript in WebView. WebView plugin has a property named as javascriptMode which has 2 parameters JavascriptMode.disabled and JavascriptMode.unrestricted. Using these parameters we can Flutter Enable Disable JavaScript in WebView Android iOS Example Tutorial.

Contents in this project Flutter Enable Disable JavaScript in WebView Example Tutorial:

1. Before getting started using WebView widget we have to download and install the plugin in our current flutter project. So open your project’s root folder and open pubspec.yaml file in code editor.

2. Find dependencies line and put webview_flutter: ^0.3.19+6 just after it.

Complete source code for my pubspec.yaml file after adding WebView:

3. Now we have to download and install newly added plugin. So open your flutter project root folder in Command Prompt in windows and Terminal in MAC and execute flutter pub get  command like i did in below screenshot.

4. Open your project’s main.dart file and import material.dart and webview_flutter.dart package.

5. Creating void main runApp() method and now we would call our main MyApp class.

6. Creating our main Root class MyApp extends with StatelessWidget. In this class we would call WebViewLoad() class.

7. Create a class named as WebViewLoad extends StatefulWidget. In this class we would make createState() method of State and pass WebViewLoadUI class name along with it.

8. Creating our main child class named as WebViewLoadUI extends State. In this class we would make the WebView widget.

  1. initialUrl : Pass the Web Page URL here.
  2. javascriptMode : Supports 2 parameters JavascriptMode.disabled to disable JavaScript and JavascriptMode.unrestricted to enable JavaScript in WebView.

9. Complete source code for main.dart file:

Screenshot:

Flutter Enable Disable JavaScript in WebView Example Tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *