`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密钥.

单击转到凭据.

点击"API密钥".

点击"浏览器".

设置名称并单击"创建".

将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

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

查看 Chrome 开发工具的“网络”选项卡，看看是否正在加载任何内容/maps/api/js- 然后尝试跟踪代码的哪一部分正在拉入 Google 地图 API。