Question

Flutter插件webview并使用javascript打印网页，但只有javascript在webview中无法使用。请帮助解决此问题。

颤振代码：

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';
    }
  }

网页代码（php，javascript和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>

该网页可与浏览器Chrome和Safari正常运行。

Answer 1

回答可能为时已晚，但就我而言，它通过从 playstore 升级 webview 解决了。在此之前，我的 webview 抱怨 ES^ 语法，如箭头函数和展开运算符。在此之后一切正常！

Answer 2

使用 flutter_webview_plugin ：以下是路线代码

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

请参阅Flutter Webview example，它将帮助您逐步实施。

使用JavaScript启用Flutter Webview

2 个答案: