开发者社区> 问答> 正文

阿里云验证码2.0测试 只能滑一次 验证码网页就卡住不动了,为什么?需要点击刷新页面或者重新打开才行

阿里云验证码2.0测试 只能滑一次 验证码网页就卡住不动了,为什么?需要点击刷新页面或者重新打开才行。

展开
收起
三分钟热度的鱼 2024-02-01 18:23:57 45 0
1 条回答
写回答
取消 提交回答
  • 参考下面代码改一下
    JavaScript:
    // 在H5页面中定义一个函数,用于发送消息给原生,并返回一个Promise
    function sendMessageToNative(action, data) {
    return new Promise((resolve, reject) => {
    // 创建一个唯一的回调函数名称
    const callbackName = 'cb_' + Math.random().toString(36).substring(2);

    // 将回调函数挂载到window对象上,以便原生代码可以调用
    window[callbackName] = (response) => {
      resolve(JSON.parse(response); // 获取webview返回的结果,注意格式转换
      // 移除挂载的回调函数,避免内存泄露或名称冲突
      delete window[callbackName];
    };
    
    // 发送消息给原生代码
    window.flutter_inappwebview.callHandler('handlerFromH5', data, callbackName)
    

    });
    }

    // 使用async函数来调用sendMessageToNative,并等待原生代码的回复
    // 业务请求(带验证码校验)回调函数
    async function captchaVerifyCallback(captchaVerifyParam) {
    let result = {};
    try {
    result = await sendMessageToNative('getVerifyData', captchaVerifyParam);
    console.log('Received response from native:', result);
    } catch (error) {
    console.error('Error communicating with native code:', error);
    }
    const verifyResult = {
    captchaResult: result.captchaVerifyResult, // 验证码验证是否通过,boolean类型,必选
    bizResult: 从result获取您的业务验证结果, // 业务验证是否通过,boolean类型,可选;若为无业务验证结果的场景,bizResult可以为空
    };

    return verifyResult;
    }
    flutter:
    import 'package:flutter/material.dart';
    import 'package:flutter_inappwebview/flutter_inappwebview.dart';

    void main() {
    runApp(MyApp());
    }

    class MyApp extends StatelessWidget {
    final InAppWebViewController _webViewController;

    MyApp({Key? key, required this._webViewController}) : super(key: key);

    @override
    Widget build(BuildContext context) {
    return MaterialApp(
    home: Scaffold(
    appBar: AppBar(
    title: Text('WebView with Flutter'),
    ),
    body: InAppWebView(
    initialUrlRequest: URLRequest(url: Uri.parse('https://your-h5-page-url')),
    onWebViewCreated: (controller) {
    _webViewController = controller;
    },
    onConsoleMessage: (controller, consoleMessage) {
    print("ConsoleMessage: ${consoleMessage.message}");
    },
    // 在这里定义JavaScript的处理器
    javascriptHandlers: {
    'handlerFromH5': (args) async {
    // 在这里处理H5传递的参数
    var data = args[0];
    var callbackFunctionName = args[1]; // 动态回调函数名
    // 做验证操作
    // print("Received from H5: $data");
    // var result = xxxx()

              // 处理数据后,返回结果给H5
              await _webViewController.evaluateJavascript(
                  source: "window['$callbackFunctionName']('$result')");
            },
          },
        ),
      ),
    );
    

    }
    }此回答整理自钉群“【客】验证码2.0接入咨询”

    2024-02-01 18:43:52
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
阿里云产品十一月刊来啦! 立即下载
阿里云产品安全基线白皮书 立即下载
云原生产业大会:阿里云精彩内容集锦 立即下载