google_maps_flutter_web and google_maps_flutter works only locally but not when hosting to firebase

huangapple go评论54阅读模式
英文:

google_maps_flutter_web and google_maps_flutter works only locally but not when hosting to firebase

问题

I'm trying to make google maps works in flutter web app, I used google_maps_flutter and google_maps_flutter_web, It only works in locally when I run it but when I build and upload the project to firebase hosting it is not working.

in web/index.html

<script src="https://maps.googleapis.com/maps/api/js?key=<mykey>&callback=Function.prototype"></script>

My simple flutter code:

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:google_maps_flutter_web/google_maps_flutter_web.dart';

void main() => runApp(GoogleMaps());

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

  @override
  State<GoogleMaps> createState() => _GoogleMapsState();
}

class _GoogleMapsState extends State<GoogleMaps> {
  LatLng ll = LatLng(37.77483, -122.41942);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Google Maps Demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Google Maps Demo'),
        ),
        body: GoogleMap(
          initialCameraPosition: CameraPosition(
            target: ll,
            zoom: 12,
          ),
          markers: {
            Marker(
              markerId: MarkerId('marker_1'),
              position: ll,
              infoWindow: InfoWindow(
                title: 'San Francisco',
              ),
            ),
          },
        ),
      ),
    );
  }
}

Does there anything special about firebase or the web for Android and IOS ?

I tried many things and I did not see anyone reported this issue in here or in github.

英文:

I'm trying to make google maps works in flutter web app, I used google_maps_flutter and google_maps_flutter_web, It only works in locally when I run it but when I build and upload the project to firebase hosting it is not working.

in web/index.html

&lt;script src=&quot;https://maps.googleapis.com/maps/api/js?key=&lt;mykey&gt;&amp;callback=Function.prototype&quot;&gt;&lt;/script&gt;

My simple flutter code:

import &#39;package:flutter/material.dart&#39;;
import &#39;package:google_maps_flutter/google_maps_flutter.dart&#39;;
import &#39;package:google_maps_flutter_web/google_maps_flutter_web.dart&#39;;

void main() =&gt; runApp(GoogleMaps());


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

  @override
  State&lt;GoogleMaps&gt; createState() =&gt; _GoogleMapsState();
}

class _GoogleMapsState extends State&lt;GoogleMaps&gt; {
  LatLng ll = LatLng(37.77483, -122.41942);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: &#39;Google Maps Demo&#39;,
      home: Scaffold(
        appBar: AppBar(
          title: Text(&#39;Google Maps Demo&#39;),
        ),
        body: GoogleMap(
          initialCameraPosition: CameraPosition(
            target: ll,
            zoom: 12,
          ),
          markers: {
            Marker(
              markerId: MarkerId(&#39;marker_1&#39;),
              position: ll,
              infoWindow: InfoWindow(
                title: &#39;San Francisco&#39;,
              ),
            ),
          },
        ),
      ),
    );
  }

Does there anything special about firebase or the web for Android and IOS ?

I tried many things and I did not see anyone reported this issue in here or in github.

答案1

得分: 1

减小 google_maps_flutter 包的版本解决了我的问题。

原来是:

google_maps_flutter: ^2.4.0

工作的版本是:

google_maps_flutter: ^2.3.0
英文:

Decreasing the package version of google_maps_flutter solved my problem.

It was:

google_maps_flutter: ^2.4.0

Working one:

google_maps_flutter: ^2.3.0

huangapple
  • 本文由 发表于 2023年4月7日 05:04:13
  • 转载请务必保留本文链接:https://go.coder-hub.com/75953770.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定