`Google Maps API警告：NoApiKeys`在尝试访问Youtube Data Api v3时

Question

我遵循Modern Redux With React教程，并尝试访问Youtube Data API v3，但在Chrome控制台中，我收到错误Google Maps API warning: NoApiKeys。我不确定为什么我会收到Google地图警告，因为我为Youtube注册了一个API密钥。

点击转到凭据。

点击＆＃34; API密钥＆＃34;。

点击＆＃34;浏览器＆＃34;。

设置名称并单击“创建”。

将API复制并粘贴到JS文件中。

import React, {Component} from 'react';
import * as ReactDOM from "react/lib/ReactDOM";
import YTSearch from 'youtube-api-search';

import SearchBar from './components/search_bar';


const API_KEY = 'AIzaSyD9WN2t4lhIZ5Es34jwaerM98r2nSutLJs';


class App extends Component {

  constructor(props) {
    super(props);

      this.state = {videos: []};

    YTSearch({key: API_KEY, term: 'surfboards'}, (videos) => {
      console.log(data);
      this.setState({videos});
    });
  }

  render() {
    return (
      <div>
        <SearchBar />
      </div>
    );
  }
}

ReactDOM.render(<App />, document.querySelector('.container'));

Answer 1

这是因为您在index.html文件中有“maps.googleapis.com/maps/api/js”。注释掉该行以防止谷歌地图试图在没有密钥的情况下加载

Answer 2

您必须在未指定API密钥的情况下加载Google Maps API。

查看Chrome开发者工具的“网络”标签，查看是否有任何内容正在加载/maps/api/js - 然后尝试跟踪代码的哪一部分正在加载Google Maps API。