将 Google 地图添加到 Flutter 时找不到 API 密钥

Posted

技术标签:

【中文标题】将 Google 地图添加到 Flutter 时找不到 API 密钥【英文标题】:API Key not found when adding Google Maps to Flutter 【发布时间】:2019-07-21 07:05:29 【问题描述】:

尝试将 google maps api 添加到 Flutter 时,我在日志中收到以下错误:

/MethodChannel#flutter/platform_views(11205): java.lang.RuntimeException: API key not found.  Check that <meta-data android:name="com.google.android.geo.API_KEY" android:value="your API key"/> is in the <application> element of AndroidManifest.xml

我的 AndroidManifest.xml 文件如下所示:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.foody.foody">


<!-- The INTERNET permission is required for development. Specifically,
     flutter needs it to communicate with the running application
     to allow setting breakpoints, to provide hot reload, etc.
-->
<uses-permission android:name="android.permission.INTERNET"/>

<!-- io.flutter.app.FlutterApplication is an android.app.Application that
     calls FlutterMain.startInitialization(this); in its onCreate method.
     In most cases you can leave this as-is, but you if you want to provide
     additional functionality it is fine to subclass or reimplement
     FlutterApplication and put your custom class here. -->
<application
    android:name="io.flutter.app.FlutterApplication"
    android:label="foody"
    android:icon="@mipmap/ic_launcher">
    <activity
        android:name=".MainActivity"
        android:launchMode="singleTop"
        android:theme="@style/LaunchTheme"
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density"
        android:hardwareAccelerated="true"
        android:windowSoftInputMode="adjustResize">
        <!-- This keeps the window background of the activity showing
             until Flutter renders its first frame. It can be removed if
             there is no splash screen (such as the default splash screen
             defined in @style/LaunchTheme). -->
        <meta-data
            android:name="io.flutter.app.android.SplashScreenUntilFirstFrame"
            android:value="true" />

        <meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="AIzaSyBM8ywYw1UDb3aXaTF3w21EJ86ePWmAkPE"/>

        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity>
</application>

我试图在其中显示地图的文件如下所示:

import 'package:flutter/material.dart';
import 'reservation.dart';
import 'dart:async';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter/services.dart';
import 'feed.dart';

class info extends StatelessWidget 
  info([this.id]);

  int id;

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      floatingActionButton: FloatingActionButton.extended(
        onPressed: () 
          Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => Reservation(id)),
          );
        ,
        icon: Icon(Icons.calendar_today),
        label: Text('Book a Table'),
        backgroundColor: Colors.blueGrey,
      ),
      body: _buildBody(context),
    );
  

  Widget _buildBody(BuildContext context) 
    return StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance
          .collection('restaurants')
          .where('id', isEqualTo: id)
          .snapshots(),
      builder: (context, snapshot) 
        if (!snapshot.hasData) return LinearProgressIndicator();

        return _buildList(context, snapshot.data.documents);
      ,
    );
  

  Widget _buildList(BuildContext context, List<DocumentSnapshot> snapshot) 
    return ListView(
      physics: BouncingScrollPhysics(),
      shrinkWrap: true,
      children: <Widget>[
        new Container(
          decoration: new BoxDecoration(boxShadow: [
            new BoxShadow(
              color: Colors.blueGrey,
              blurRadius: 20.0,
            )
          ]),
          child: new Image.network(snapshot[0].data['picURL']),
        ),
        Padding(
          padding: const EdgeInsets.all(7.0),
          child: Text(snapshot[0].data['name'],
              style: TextStyle(fontWeight: FontWeight.bold, fontSize: 36)),
        ),
        Padding(
          padding: const EdgeInsets.all(7.0),
          child: Text(snapshot[0].data['desc'],
              style: TextStyle(fontWeight: FontWeight.bold, fontSize: 36)),
        ),
        Container(
          height: MediaQuery
              .of(context)
              .size
              .height,
          width: MediaQuery
              .of(context)
              .size
              .width,
          child: GoogleMap(
            initialCameraPosition: CameraPosition(target: LatLng(37.4219999, -122.0862462)),
            onMapCreated: (GoogleMapController controller) ,
          ),
        ),
      ],
    );
  

我尝试多次重新生成密钥并重新启动我的应用和 android studio,但无济于事。

谢谢

【问题讨论】:

【参考方案1】:

您当前已将meta-data 元素作为活动 的一部分。文档说要使其成为 application 的子项:

在 AndroidManifest.xml 中,将以下元素添加为 &lt;application&gt; 元素的子元素,方法是将其插入到结束 &lt;/application&gt; 标记之前

所以我建议你试着把它移到&lt;/activity&gt;之后。

【讨论】:

我也是这样做的。但仍然面临 API 未找到问题 @SandeepMaurya:我建议您使用确切的 XML 和确切的错误消息提出一个新问题。 (错误是“API not found”还是“API key not found”?它们很不一样!)【参考方案2】:

如果您一开始将 &lt;meta-data&gt; 标签放置在错误的位置,请说在 &lt;activity&gt; 标签中。 p>

    您需要运行 "flutter clean" 来清理 android 和 ios 构建目录。

    然后确保在&lt;/application&gt; 标记的正上方创建&lt;meta-data&gt; 标记。

你应该很高兴。我遇到了这个问题,它对我有用。在github问题上找到了答案。

【讨论】:

【参考方案3】:

在我的例子中,我操作了一个错误的清单文件,因为有 2 个同名文件,一个在 src 目录,另一个在 src/main,请务必使用后一个,LOL。

【讨论】:

【参考方案4】:

这里有一些你可以尝试的快速修复方法,并且稍微清除一下上面的答案:

    运行flutter clean

    将密钥添加到AndroidManifest.xml (android/app/src/main):

    尝试将右侧放在应用程序元素之后。

    打开android > app > src > main ‣ AndroidManifest.xml 并将 Google Maps 元数据标签粘贴到您的应用程序标签中的活动标签之前,放置您之前复制的 API 密钥以替换 @ 987654327@.

    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="com.succo.succo">
        …
        <uses-permission android:name="android.permission.INTERNET"/>
        <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
        <application>
            <meta-data android:name="com.google.android.geo.API_KEY"
                android:value="YOUR_API_KEY_HERE"/>
        </application>
    </manifest>
    

    对于值字段,请在 Google Maps API 注册过程中粘贴您的 API Key。

【讨论】:

以上是关于将 Google 地图添加到 Flutter 时找不到 API 密钥的主要内容,如果未能解决你的问题,请参考以下文章

如何在颤振中与谷歌地图集成?

在 pubspec.yaml 中添加 Google Maps 包后,Flutter iOS 应用程序将无法构建

Flutter Google Maps - 将相机移动到当前位置

Flutter 中的 Google Maps 相机位置更新问题

Flutter - 谷歌地图折线模式不起作用

Flutter:将 iOS 上的 Google Maps SDK 从 3.9.0 更新到 4.1.0.0