尝试启动 Flutter WebView 时出现异常

Posted 2023-02-23

【中文标题】尝试启动 Flutter WebView 时出现异常

【英文标题】：Exception while trying to launch a Flutter WebView

【发布时间】：2022-01-23 03:35:48

【问题描述】：

我在尝试启动 Flutter WebView 时遇到异常。我得到的例外是：

if (errorCode is String && (errorMessage == null || errorMessage is String) && !buffer.hasRemaining)
      throw PlatformException(code: errorCode, message: errorMessage as String?, details: errorDetails, stacktrace: errorStacktrace);
    else
      throw const FormatException('Invalid envelope');

我尝试通过单击底部导航栏中的按钮来启动 Webview。我用一个显示 web 视图的小部件创建了一个不同的类。我试图调用包含 webview 的类。

我将附上下面的整个代码以便更好地理解。谢谢。

完整代码：

class dashboard extends StatefulWidget 
  @override
  _dashboardState createState() => _dashboardState();


class Google extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      title: 'Google',
      home: Scaffold(
        appBar: AppBar(
          title: const Text(
            'Google',
          ),
        ),
        body: const WebView(
          initialUrl: "https://codeseasy.com",
          javascriptMode: JavascriptMode.unrestricted,
        ),
      ),
    );
  


// ignore: camel_case_types
class _dashboardState extends State<dashboard> 
  int currentIndex = 1;

  changeIndex(index) 
    setState(() 
      currentIndex = index;
    );
  

  void onTabTapped(int index) 
    if (index == 2) 
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (context) => HomePage(),
        ),
      );
    
    if (index == 0) 
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (context) => Google(),
        ),
      );
    
    if (index == 1) 
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (context) => Notifications(),
        ),
      );
    
  

  final List<Widget> _children = [
    HomePage(),
    Notifications(),
    forgotPassword(),
  ];

  @override
  Widget build(BuildContext context) 
    final authService = Provider.of<AuthService>(context);
    return Scaffold(
      body: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(top: 80.0, right: 250),
              child: Center(
                child: Container(
                  width: 200.0,
                  height: 20.0,
                  decoration:
                      BoxDecoration(borderRadius: BorderRadius.circular(15.0)),
                  child: (const Text(
                    'Hello',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        fontWeight: FontWeight.bold, color: Colors.black),
                  )),
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(left: 300.0, top: 1.0),
              child: IconButton(
                icon: const Icon(Icons.account_circle, size: 30.0),
                onPressed: () 
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => HomePage(),
                    ),
                  );
                ,
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(left: 300.0, top: 5.0),
              child: IconButton(
                icon: const Icon(
                  Icons.notifications,
                  size: 25.0,
                ),
                onPressed: () 
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => Notifications(),
                    ),
                  );
                ,
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 0.0),
              child: Center(
                child: Container(
                  width: 390,
                  height: 450,
                  decoration: BoxDecoration(
                      color: Colors.green.shade100,
                      borderRadius: BorderRadius.circular(10.0)),
                ),
              ),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(onPressed: () async 
        await authService.signOut();
      ),
      //  : _children[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        //  currentIndex: onTabTapped,
        type: BottomNavigationBarType.fixed,
        backgroundColor: Colors.green[100],
        onTap: onTabTapped,
        items: const [
          BottomNavigationBarItem(
            icon: Icon(Icons.book_online),
            label: 'Google',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.read_more),
            label: 'Notifications',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.account_circle),
            label: 'Profile',
          ),
        ],
      ),
    );
  

异常截图：

提前谢谢你。

【问题讨论】：

您是否尝试过使用 Navigator.of(context).pushReplacement ？如果没有尝试使用 pushReplacement 而不是 push 导航

是的，使用 Navigator.of(context).pushReplacement 有效，但是当我使用 .pushReplacement 时我无法向后导航。有什么方法可以从 WebView 导航回来？

【参考方案1】：

你读过包裹documentation吗？

字面意思

用法 在 pubspec.yaml 文件中添加 webview_flutter 作为依赖项。如果您的目标是 android，请务必阅读下面的 Android 平台视图部分，以选择最适合您需求的平台视图模式。

长话短说，你必须在 initState 函数的 Google 类中添加这一行：if (Platform.isAndroid) WebView.platform = AndroidWebView();

还需要将android/app/build.gradle中的minSdkVersion修改为20