2016-03-18 10 views
6

Ich befolge das Tutorial Modern Redux mit Reagieren und versuchen, auf die Youtube Data API v3 zuzugreifen, aber in der Chrome-Konsole erhalte ich den Fehler Google Maps API warning: NoApiKeys. Ich bin mir nicht sicher, warum ich eine Google Maps-Warnung erhalte, weil ich einen API-Schlüssel für Youtube registriert habe.`Google Maps API Warnung: NoApiKeys` beim Versuch, auf Youtube Daten zuzugreifen Api v3

Gekickt Weiter zu Anmeldeinformationen.

Clicked Go to Credentials.

Clicked "API Key".

Clicked "API Key".

Clicked "Browser".

Clicked "Browser".

Set Name und angeklickt erstellen.

Set name and clicked create.

kopiert und API in JS-Datei eingefügt.

Copied and pasted API into JS file.

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')); 

Antwort

1

Sie müssen ohne Angabe eines API-Schlüssels die Google Maps API werden geladen.

Schauen Sie in der Registerkarte "Netzwerk" von Chrome Dev Tools nach, ob etwas geladen werden kann. Versuchen Sie dann, herauszufinden, welcher Teil Ihres Codes in der Google Maps-API verwendet wird.

4

Dies liegt daran, dass Sie "maps.googleapis.com/maps/api/js" in Ihrer index.html-Datei haben. Kommentieren Sie diese Zeile, um zu verhindern, dass Google Maps ohne Schlüssel geladen werden kann