Flutter webview with javascript enable

Question

Flutter plugin webview and use javascript to print the web page, but only the javascript is not working in webview. Please kindly help to solve this issue.

Flutter code:

Future<Null> _launchInWebViewWithJavaScript(String url) async {
    if (await canLaunch(url)) {
      await launch(
        url,
        forceSafariVC: true,
        forceWebView: false,
        enableJavaScript: true,
      );
    } else {
      throw 'Could not launch $url';
    }
  }

Webpage code (php, javascript and html):

<?php
    $qrString = $_GET['qrString'];
    $tableNumber = $_GET['tableNumber'];
?>

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>receipt</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.css">
  <link rel="stylesheet" href="../paper.css">
  <style>
    @page { size: 75mm 100mm } /* output size */
    body.receipt .sheet { width: 58mm; height: 100mm } /* sheet size */
    @media print { body.receipt { width: 58mm } } /* fix for Chrome */
  </style>

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

</head>

<body class="receipt">
  <section class="sheet padding-10mm">
        <?php echo '<h1>檯號: '.$tableNumber. '</h1><br>' ?>


      <img id='barcode' 
            src=<?php echo 'https://api.qrserver.com/v1/create-qr-code/?data=' .$qrString. '&amp;size=300x300' ?>
            alt="" 
            title="HELLO" 
            width="300" 
            height="300" />
  </section>
</body>

<script type="text/javascript">
<!--
window.print();
</script>
</html>

The webpage is working fine with browser Chrome and Safari.

Anurag Vohra · Accepted Answer · 2021-01-12 10:08:22Z

2

May be too late to answer, but for my case it solved by upgrading webview from playstore. Earlier before this my webview was complaining about ES^ syntaxes like arrow function and spread operator. Aftre this it works all fine!

answered Jan 12, 2021 at 10:08

Anurag Vohra

2,0331 gold badge20 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ryan M · Accepted Answer · 2022-09-11 02:26:12Z

2

Use flutter_webview_plugin: Following will be route code

routes: {
"/webview": (_) => WebviewScaffold(
url: url,
appBar: AppBar(
title: Text("Webview"),
),
withJavascript: true,
withLocalStorage: true,
withZoom: true,
)
},

edited Sep 11, 2022 at 2:26

Ryan M♦

20.6k35 gold badges75 silver badges85 bronze badges

answered Dec 9, 2018 at 14:31

Ramees

644 silver badges16 bronze badges

2 Comments

GPH Over a year ago

it is same, javascript is not working when we go to the webpage. It suppose to start printing preview, but it didn't show printing preview.

Zain SMJ Over a year ago

Yes. This plugin gives an error which says "Browser not supported". Means ES6 is not supported.

Collectives™ on Stack Overflow

Flutter webview with javascript enable

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related