Question

使用inital_url：“ https://github.com/flutter/plugins/tree/master/packages/webview_flutter/example”运行webview_flutter示例应用程序（https://kreatryx.com）在Android上，它仅显示白屏，并在右下角带有Zopim聊天栏。在iOS上，它运行良好。 Android的任何解决方案？

我已经尝试过的方法： 1. Flutter频道开发 2. Flutter频道主控

Answer 1

由于本文中的github Issues reference，以下解决方案对我有用，可以编辑 Info.plist ：

<key>io.flutter.embedded_views_preview</key>
<string>YES</string>
<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key> <true/>
  <key>NSAllowsArbitraryLoadsInWebContent</key> <true/>
</dict>

我对使用 Info.plist 是陌生的，并且不确定<dict>标签是否可以这样嵌套，但是显然可以。

Answer 2

更新

类似于Android Webview: "Uncaught TypeError: Cannot read property 'getItem' of null"

settings.setDomStorageEnabled(true);丢失。

相关问题https://github.com/flutter/flutter/issues/26347

原始

webview_flutter当前不会自动重定向。

https://kreatryx.com重定向到https://www.kreatryx.com，并且插件不遵循该重定向，仅显示https://kreatryx.com返回的内容，没什么。

关注https://github.com/flutter/flutter/issues/25351

Answer 3

因为有另一个可用的插件，该插件能够自动重定向到其请求的页面。使用给定的dart插件： flutter_webview_plugin 0.3.0 + 2

您可以通过以下网址使用该插件：https://pub.dartlang.org/packages/flutter_webview_plugin#-readme-tab-

在此处找到示例代码：

new MaterialApp(
      routes: {
        "/": (_) => new WebviewScaffold(
          url: "https://kreatryx.com",
          appBar: new AppBar(
            title: new Text("Widget webview"),
          ),
        ),
      },
    );

Answer 4

您可以使用我的插件flutter_inappwebview，它是Flutter插件，允许您添加内联WebView或打开应用程序内浏览器窗口，并具有许多事件，方法和选项来控制WebView。

使用您的网址的完整示例：

import 'dart:async';

import 'package:flutter/material.dart';

import 'package:flutter_inappwebview/flutter_inappwebview.dart';

Future main() async {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: InAppWebViewPage()
    );
  }
}

class InAppWebViewPage extends StatefulWidget {
  @override
  _InAppWebViewPageState createState() => new _InAppWebViewPageState();
}

class _InAppWebViewPageState extends State<InAppWebViewPage> {
  InAppWebViewController webView;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            title: Text("InAppWebView")
        ),
        body: Container(
            child: Column(children: <Widget>[
              Expanded(
                child: Container(
                  child: InAppWebView(
                    initialUrl: "https://kreatryx.com",
                    initialHeaders: {},
                    initialOptions: InAppWebViewWidgetOptions(
                      inAppWebViewOptions: InAppWebViewOptions(
                        debuggingEnabled: true,
                      ),
                      androidInAppWebViewOptions: AndroidInAppWebViewOptions(
                        domStorageEnabled: true,
                        databaseEnabled: true,
                      ),
                    ),
                    onWebViewCreated: (InAppWebViewController controller) {
                      webView = controller;
                    },
                    onLoadStart: (InAppWebViewController controller, String url) {

                    },
                    onLoadStop: (InAppWebViewController controller, String url) {

                    },
                  ),
                ),
              ),
            ]))
    );
  }
}

它在Android和iOS平台上均可正常运行。结果是：

Answer 5

如果您使用的 url 不是全英文或有一些空格字符。您需要像这样对网址进行编码

 WebView(
      initialUrl: Uri.encodeFull(yourUrl),
      ...
 )

如何修复webview_flutter中的白屏？

5 个答案: