标签: flutter-web

我在我的 android flutter 应用程序中使用了 google maps api 和 location pub,dev 包，并尝试使用 api 中的 url 调出图像。这是带有一些代码的网址：

class LocationHelper{
  static String mapviewpointer({double latitude, double longitude}){
    return "https://maps.googleapis.com/maps/api/staticmap?center=$latitude,$longitude&zoom=13&size=600x300&maptype=roadmap&markers=color:pink%7Clabel:C%7C$latitude,$longitude&key=$GOOGLE_API_KEY";
  }
}

它抛出以下错误消息：

Plugin project :location_web not found. Please update settings.gradle;

我不知道如何解决这个错误。

这是我在终端中收到的另一个错误：

I/flutter (21880): Invalid argument(s): No host specified in URI file:///Instance%20of%20'Future%3CString%3E'

我收到上述错误消息的区域在我的代码中：

Future <String> _getUserLocation() async{
  final locData = await Location().getLocation();
  final staticMapUrl = LocationHelper.mapviewpointer(
    latitude: locData.latitude, 
    longitude: locData.longitude,
    );
    return staticMapUrl;
}

final mapview = _getUserLocation();


class NearbyScreen extends StatelessWidget {
  @override …

Flutter Web 项目的默认 URL 定义了一个包含 hashtag ( #)的 URL ，如下所示：

http://localhost:41521/#/peaple/...

我想删除这个“#”，看起来像这样：

http://localhost:41521/peaple/

我怎么解决这个问题？

我shared_preferences在适用于 iOS 和 Android 的 Flutter 应用程序中使用。在网络上，我使用http:dart依赖项 ( window.localStorage) 本身。由于 Flutter for web 被合并到 Flutter repo 中，我想创建一个跨平台的解决方案。

这意味着我需要导入两个单独的 API。这在 Dart 中似乎还没有得到很好的支持，但这就是我所做的：

import 'package:some_project/stub/preference_utils_stub.dart'
    if (dart.library.html) 'dart:html'
    if (dart.library.io) 'package:shared_preferences/shared_preferences.dart';

在我的preference_utils_stub.dart文件中，我实现了在编译时需要可见的所有类/变量：

Window window;

class SharedPreferences {
  static Future<SharedPreferences> get getInstance async {}
  setString(String key, String value) {}
  getString(String key) {}
}

class Window {
  Map<String, String> localStorage;
}

这在编译之前消除了所有错误。现在我实现了一些检查应用程序是否正在使用网络的方法：

static Future<String> getString(String key) async {
    if (kIsWeb) {
       return window.localStorage[key];
    }
    SharedPreferences preferences = …

我正在学习 Flutter web。现在我想在真实服务器中部署这段代码。这里的颤振代码：在 lib 文件夹中

void main() => runApp(new MyApp());    
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter layout demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter layout demo'),
        ),
        body: Center(
          child: Text('Hello World'),
        ),
      ),
    );
  }
}

如何在服务器上部署此代码？我是 Flutter 网站的新手。

Finished with error: 无法与 Chrome 中的应用程序实例建立连接。如果 Web 工具使用的 websocket 连接无法正确建立连接（例如由于防火墙），就会发生这种情况。

当我在 chrome 浏览器上运行我的 flutter web 应用程序时，我收到了这个错误。即使没有解决我的问题，我也关闭了我的防火墙。

解决此错误的可能解决方案是什么？

我尝试过的临时解决方案：
从开发频道升级到主频道时遇到了这个问题。我为解决这个问题所做的是清理我的项目的构建缓存（flutter clean），然后使用发布模式运行该项目。之后，我可以在调试模式下运行它。

这暂时解决了我的问题，一段时间后我仍然面临同样的问题。实施相同的解决方案并没有解决我的问题。

[更新]

我可以确认这个问题发生在2.5以上的flutter中。使用2.2.3就可以了。问题是为什么这个功能在 2.5 中被删除了？那么如何在flutter 2.5中启用它呢？

[起源问题]

我正在使用桌面浏览器在 flutter web 上使用 SingleChildScrollView 。滚动仅适用于鼠标滚轮，不适用于鼠标单击（拖动）。如何将鼠标点击映射为像移动设备一样触摸和滚动？

import \'package:flutter/material.dart\';\n\nvoid main() {\n  runApp(const MyApp());\n}\n\nclass MyApp extends StatelessWidget {\n  const MyApp({Key? key}) : super(key: key);\n  @override\n  Widget build(BuildContext context) {\n    return MaterialApp(\n      title: \'Flutter Demo\',\n      theme: ThemeData(\n        primarySwatch: Colors.blue,\n      ),\n      home: SingleChildScrollView(\n        child: Column(\n          children: List<Widget>.generate(50, (i) => Text(i.toString())).toList(),\n        ),\n      ),\n    );\n  }\n}\n

flutter doctor -v\n[\xe2\x9c\x93] Flutter (Channel master, 2.6.0-6.0.pre.6, on Ubuntu 20.04.3 LTS 5.11.0-34-generic, locale en_US.UTF-8)\n    \xe2\x80\xa2 Flutter version 2.6.0-6.0.pre.6 at …

我正在尝试在我的 flutter web 项目中使用 Firebase。
但是应用程序无法使用此消息运行。

TypeError: dart.global.firebase.firestore is not a function
at Object.firestore$ [as firestore] 

我的index.html看起来像这样。

  <script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-analytics.js"></script>

  <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
      apiKey: "MY_API_KEY",
      authDomain: "MY_AUTHDOMAIN",
      databaseURL: "MY_URL",
      projectId: "MY_ID",
      storageBucket: "MY_BUCKET",
      messagingSenderId: "MY_ID",
      appId: "MY_APPID",
      measurementId: "MY_ID"
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
  </script>

有谁知道如何解决这个问题？
谢谢！！

我正在构建一个网络应用程序，它需要一个获取帖子 ID 的路由，然后它将使用该 ID 获取帖子。

我怎么能有 URL 参数让我们说/post/:idid 是参数

我的应用目前看起来像这样：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // title: "Paste",
      initialRoute: "/",
      theme: ThemeData(
          primarySwatch: Colors.green,
          primaryColor: Colors.blue
      ),
      routes: {
        "/": (context) => HomePage(),
        "/post": (context) => PastieRoute()
      },
      debugShowCheckedModeBanner: false
    );
  }
}

编辑：这是我根据@BloodLoss 尝试过的，出于某种原因，我在访问时没有得到任何东西到控制台 localhost:8080/post?id=123

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: "/",
      routes: {
        "/": (context) => HomePage(),
        "/post": (context) => PastieRoute()
      }, …

我正在使用 flutter web 和 firebase 身份验证来构建一个 web 应用程序。为此 1. 使用 Google 登录作为登录方法之一创建了 Firebase 应用程序。2. 添加了https://github.com/FirebaseExtended/flutterfire/tree/master/packages/firebase_auth/firebase_auth/example 和https://dart-pub.mirrors.sjtug.sjtu.edu.cn/ 中给出的依赖项包/firebase_auth_web。

当我尝试登录时，会出现 Google 登录窗口。一旦我输入电子邮件地址并按回车键，就会出现以下错误。

“无法登录此浏览器或应用程序可能不安全。请尝试使用其他浏览器。如果您已经在使用受支持的浏览器，您可以刷新屏幕并再次尝试登录。”

我用的是 Chrome 浏览器。我应该怎么做才能使我的应用程序更安全？对于 android，我们可以选择使用 SHA 密钥来加密连接。我们需要为 web 做类似的事情吗？

我无法通过 API 调用从其他域加载 flutter web 中的网络图像。收到这个错误

试图从另一个域加载图像？在以下位置找到答案： https: //flutter.dev/docs/development/platform-integration/web-images ImageCodecException：无法加载网络图像。

有什么帮助吗？