首页 > 解决方案 > 我无法从 Flutter 中的 javaScript 获取数据

问题描述

我尝试注入一些 javascript 代码,以通过 webview_flutter 获得一些价值,我能够获得一些数据,但是当我使用 try catch 或函数时,它不会出现错误

[INFO:CONSOLE(1)]“Uncaught SyntaxError: Unexpected token 'var'”,来源:https ://www.amazon.com/Hanes-Heavyweight-Henley-Slate-Heather/dp/B07TPPZYFV/ (1)

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

带有 webview 的有状态小部件

    class JSInWebView extends StatefulWidget {
      @override
      JSInWebViewState createState() {
        return new JSInWebViewState();
      }
    }
    
    class JSInWebViewState extends State<JSInWebView> {
      // final flutterWebviewPlugin = new FlutterWebviewPlugin();
    
      final Completer <WebViewController> _controller = Completer<WebViewController>();
    
    
    // var productTitle;
    var js = 'document.querySelector("#partialStateBuybox").remove()';
    
   
      @override
      void initState(){
        super.initState();
      }
    
      @override
      void dispose() {
        super.dispose();
      }

用于加载 webView 并运行 javaScript 代码的小部件

@override
      Widget build(BuildContext context) {
        return Scaffold(
          body:WebView(
            javascriptMode: JavascriptMode.unrestricted,
            initialUrl: 'https://www.amazon.com/Hanes-Heavyweight-Henley-Slate-Heather/dp/B07TPPZYFV/',
            onWebViewCreated: (WebViewController webViewController){
              _controller.complete(webViewController);
            },
            onPageFinished: (url){
              allJsfile();
            },
            javascriptChannels: <JavascriptChannel>[
              _getPInfoChannel(),
              _getPColor(context),
            ].toSet(),
          ),
    
          floatingActionButton: _showUrlbtn(),
        );
      }
    
      Widget _showUrlbtn(){
        return FutureBuilder<WebViewController>(
            future: _controller.future,
          builder: (BuildContext context, AsyncSnapshot<WebViewController> controller){
    
              if(controller.hasData){
                return FloatingActionButton(
                  child: Icon(Icons.link),
                  onPressed: () async{
                    String ss = await controller.data.currentUrl();
                    print(ss);
                  },
                );
              }else{
                return Container();
              }
          },
        );
    
      }
    
     void allJsfile() {
    
// var localjs = 'let color = () => {try {productColor = document.getElementById("color_name-button").innerText.trim().split(":")[1].trim()} catch {productColor = "";try {let bulkArray = document.getElementById("inline-twister-experiment-container").innerText.trim().split("\\n");for (let i = 0; i < bulkArray.length; i++) {if (bulkArray[i].includes("Color")) {productColor = bulkArray[i].split(":")[1].trim();}}} catch {productColor = "";}} return productColor;};';

    _controller.future.then((value) {
          value.evaluateJavascript(js);
          value.evaluateJavascript('productitle.postMessage(document.getElementById("title").innerText.trim());');
          // value.evaluateJavascript("producColor.postMessage(let bulkArray = document.getElementById('inline-twister-experiment-container').innerText.trim().split('\\n');for(let i = 0; i < bulkArray.length; i++) {if (bulkArray[i].includes('Color')) {productColor = bulkArray[i].split(':')[1].trim();}})");
          value.evaluateJavascript('color.postMessage(var productPrice=()=>{let e=document.getElementById("priceblock_ourprice");if(null!=e&&""!=e&&null!=e)return e.innerText.trim();{let r=document.getElementById("newPitchPriceWrapper_feature_div").innerText.trim().split(" ");if(null!=(e=r[0]+r[1]+"."+r[2])&&""!=e)return console.log(e),e}return""};productPrice(););');
    
    
        });
      }
    
      JavascriptChannel _getPInfoChannel() {
        return JavascriptChannel(
            name: 'productitle',
            onMessageReceived: (JavascriptMessage message){
              String ssss = message.message;
              print("Title: $ssss");
        });
      }
      JavascriptChannel _getPColor(BuildContext context) {
        
        return JavascriptChannel(
            name: 'color',
            onMessageReceived: (message){
              String ssss = message.message;
    
    
              print("Color: "+ message.message);
        });
      }
    }

标签: flutter

解决方案


推荐阅读