首页 > 解决方案 > Flutter Web调用js值导致灰屏

问题描述

您好,我正在使用 Flutter Web 制作网站。但我有一个问题。我在 dart 文件中使用 index.html 中的 javascript 值。它给了我一个问题。当我在发布模式下运行项目时,我可以看到灰屏。我认为原因正是调用 javascript 值。这是我的 index.html 的脚本代码。

window.onload = function() {
      var isAndroid = /(android)/i.test(navigator.userAgent);
      var isIOS = !!navigator.platform.match(/iPhone|iPod|iPad/);
      var browse = navigator.userAgent.toLowerCase();
      var kakaotalk = false;
      if(browse.indexOf("kakaotalk") != -1) {
        kakaotalk = true;
      }
      window.state = {
        id: id,
        isAndroid: isAndroid,
        isIOS: isIOS,
        browse: browse,
        kakaotalk: kakaotalk,
      };
    }

这是我的颤振代码。我在 statefulwidget 的 initstate 中调用了 js 的值。

var state = js.JsObject.fromBrowserObject(js.context['state']);
  var isAndroid;
  var isIOS;
  var browse;
  var kakaotalk;
  @override
  void initState() {
    super.initState();
    isAndroid = state["isAndroid"];
    isIOS = state["isIOS"];
    browse = state["browse"];
    kakaotalk = state["kakaotalk"];
  }

如何解决灰屏错误?我想知道答案。我不能解决这个错误一个月。

“颤振医生-v”的结果

[✓] Flutter (Channel stable, 2.2.0, on macOS 11.3 20E232 darwin-x64, locale ko-KR)
    • Flutter version 2.2.0 at /Users/shinyoung/development/flutter
    • Framework revision b22742018b (9일 전), 2021-05-14 19:12:57 -0700
    • Engine revision a9d88a4d18
    • Dart version 2.13.0

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.


[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.5, Build version 12E262
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).

[✓] VS Code (version 1.56.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.22.0

[✓] Connected device (1 available)
    • Chrome (web) • chrome • web-javascript • Google Chrome 90.0.4430.212

! Doctor found issues in 2 categories.

Flutter 版本是 2.2.0,dart 版本是 2.13.0!

黄色图标只是我在 index.html 文件中添加的加载图像。 灰屏

标签: javascriptflutterdartweb

解决方案


推荐阅读