如何在 flutter 中打印来自 Web 平台的响应？-解网

问：

在我的代码中，我已经在 Web 平台上启动了 URL，也获得了响应，我无法从 Web 端获取和打印响应。

这是我的简单代码：

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:http/http.dart' as http;
import 'package:universal_html/html.dart' as html;

class MyWebApp extends StatefulWidget {
  const MyWebApp({super.key});

  @override
  State<MyWebApp> createState() => _MyWebAppState();
}

class _MyWebAppState extends State<MyWebApp> {
  final url =
      "https://accounts.google.com/o/saml2/initsso?idpid=C02qtgmcd&spid=859837136968&forceauthn=false";
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Web Application"),
      ),
      body: Container(
        color: Colors.blue,
        child: Center(
          child: ElevatedButton(
              onPressed:
                  () {
                html.window.open(url, 'Google Authentication', 'popup');
              },
              child: const Text("Login")),
        ),
      ),
    );
  }
}

这是我在网络端得到的响应，但无法得到它：

{"status":1,"msg":"user Authenticated !!","user":{"userFirstName":"Max","userLastName":"Well","userEmail":"[email protected]","userType":"manager","manager":true,"employee":false,"teamLead":false},"token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbWFpbCI6ImdhdXJhdkB0aGVsYXR0aWNlLmluIiwiZmlyc3ROYW1lIjoiR2F1cmF2IiwibGFzdE5hbWUiOiJLdW1hciIsIm1hbmFnZXIiOnRydWUsImVtcGxveWVlIjpmYWxzZSwidGVhbUxlYWQiOmZhbHNlLCJpYXQiOjE3MDAyMDQ4NjQsImV4cCI6MTcwMDI5MTI2NH0.alsdjflaksjweio39lskdjf923030923jslkdf"}

任何人都可以帮我在控制台中获取并打印响应吗？

Flutter Dart 网址

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:universal_html/html.dart' as html;

class MyWebApp extends StatefulWidget {
  const MyWebApp({Key? key}) : super(key: key);

  @override
  State<MyWebApp> createState() => _MyWebAppState();
}

class _MyWebAppState extends State<MyWebApp> {
  final url = "your url";
      

  void _openUrl() {
    html.window.open(url, 'Google Authentication', 'popup');
    html.window.onMessage.listen((event) {
      final receivedData = json.decode(event.data);
      print(receivedData); // Print the received data in the console
      // Handle the received data as needed
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Web Application"),
      ),
      body: Container(
        color: Colors.blue,
        child: Center(
          child: ElevatedButton(
            onPressed: _openUrl,
            child: const Text("Login"),
          ),
        ),
      ),
    );
  }
}

替代解决方案，

要从打开的 URL 中捕获响应数据，您可以在打开的窗口中使用 JavaScript，并在 Flutter 应用程序中收听此消息。Window.postMessage

首先你应该做一个喜欢的波纹管，webviewcontroller

late WebViewController _webViewController;

全面实施，

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:universal_html/html.dart' as html;
import 'package:webview_flutter/webview_flutter.dart';

class MyWebApp extends StatefulWidget {
  const MyWebApp({Key? key}) : super(key: key);

  @override
  State<MyWebApp> createState() => _MyWebAppState();
}

class _MyWebAppState extends State<MyWebApp> {
  final url =
      "https://accounts.google.com/o/saml2/initsso?idpid=C02qtgmcd&spid=859837136968&forceauthn=false";

  late WebViewController _webViewController;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Web Application"),
      ),
      body: WebView(
        initialUrl: url,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: (WebViewController controller) {
          _webViewController = controller;
        },
        javascriptChannels: <JavascriptChannel>{
          JavascriptChannel(
            name: 'PrintResponse',
            onMessageReceived: (JavascriptMessage message) {
              final receivedData = json.decode(message.message);
              print(receivedData); // Print the received data in the console
              // Handle the received data as needed
            },
          ),
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () async {
          if (_webViewController != null) {
            await _webViewController.evaluateJavascript(
                'window.postMessage(JSON.stringify(document.body.innerText))');
          }
        },
        child: const Icon(Icons.send),
      ),
    );
  }
}

这个更新的代码利用 from 在你的 Flutter 应用中加载 URL。它设置一个 JavascriptChannel 来接收来自 Web 内容的消息。当按下浮动操作按钮时，它会评估 JavaScript 以通过发送网页内容。WebViewwebview_flutterwindow.postMessage

这是我得到的：调试服务侦听 ws://127.0.0.1:52897/a5DC1IYy-hc=/ws 调试服务侦听 ws://127.0.0.1:52897/a5DC1IYy-hc=/ws webOnlyAssetManager getter 已弃用，将在将来的版本中删除。请改用 from。webOnlyAssetManager getter 已弃用，将在将来的发行版中删除。请改用 from。assetManagerdart:ui_webassetManagerdart:ui_web

0赞 Dhanusha Dilshan 11/17/2023

我更新了新的解决方案作为替代方案，如果您更新了代码，请在运行项目之前进行清理和升级。

上一个：提交时的 Django 表单重定向到错误的 URL

下一个：启动动态路由@

如何在 flutter 中打印来自 Web 平台的响应？

How to print the response from the web platform in flutter?

评论

评论