YouTube-API - Extrahieren von Titel- und videoId-Attributen zum Erstellen von Hyperlinks

Im Folgenden finden Sie eine JavaScript-Datei, die mithilfe der API YouTube-Videodaten durchsucht. Unten sehen Sie die Funktion onSearchResponse(), die showResponse() aufruft, die wiederum die Suchergebnisse anzeigt.YouTube-API - Extrahieren von Titel- und videoId-Attributen zum Erstellen von Hyperlinks

Da dieser Code von Codecademy steht, wird eine HUGE Menge an Informationen in Bezug auf meinen Suchbegriff gedruckt. mit dem Titel und videoId Attribute

Statt das alles, kann ich einfach einen Hyperlink angezeigt werden? Wie würde ich responseString in showResponse() ändern, um diesen Link zu erstellen? Vielen Dank!

// Your use of the YouTube API must comply with the Terms of Service: 
// https://developers.google.com/youtube/terms 

// Helper function to display JavaScript value on HTML page. 
function showResponse(response) { 
    var responseString = JSON.stringify(response, '', 2); 
    document.getElementById('response').innerHTML += responseString; 
} 

// Called automatically when JavaScript client library is loaded. 
function onClientLoad() { 
    gapi.client.load('youtube', 'v3', onYouTubeApiLoad); 
} 

// Called automatically when YouTube API interface is loaded (see line 9). 
function onYouTubeApiLoad() { 
    // This API key is intended for use only in this lesson. 
    // See link to get a key for your own applications. 
    gapi.client.setApiKey('AIzaSyCR5In4DZaTP6IEZQ0r1JceuvluJRzQNLE'); 

    search(); 
} 

function search() { 
    // Use the JavaScript client library to create a search.list() API call. 
    var request = gapi.client.youtube.search.list({ 
     part: 'snippet', 
     q: 'clapton' 
    }); 

    // Send the request to the API server, 
    // and invoke onSearchRepsonse() with the response. 
    request.execute(onSearchResponse); 
} 

// Called automatically with the response of the YouTube API request. 
function onSearchResponse(response) { 
    showResponse(response); 
    console.log(response); 
}

Hier ist die entsprechende HTML-Datei:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <link rel="stylesheet" href="stylesheets/styles.css"> 
    <meta charset="UTF-8"> 
    <title>My YouTube API Demo</title> 
</head> 
<body> 
    <section> 
     <div id="response"></div> 
    </section> 
    <script src="javascripts/search-2.js"></script> 
    <script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script> 
</body> 
</html>

Ihre Beratung ist sehr willkommen!

Quelle

2016-06-04 Nathan Heller

Was ist ein Hyperlink mit 'title' und' videoId', die Sie genau machen möchten? Kannst du ein Beispiel geben? –

Danke für Ihre Antwort! Hilft [dies] (http://i.imgur.com/F5Srism.png?1)? Ich möchte den Titel als HTML-Text und die Video-ID als Teil der URL verwenden, auf die der Text verweist. –

Ich denke, es könnte sein, was Sie gerade versuchen zu tun.

function showResponse(response) { 
    var html = response.items.map(itemToHtml); 
    document.getElementById('response').innerHTML += html; 
} 

function itemToHtml(item) { 
    var title = item.snippet.title; 
    var vid = item.id.videoId; 
    return generateHyperlink(title, vid); 
} 

function generateHyperlink(title, vid) { 
    return '<a href="https://www.youtube.com/watch?v=' + vid + '">' + title + '</a><br/>'; 
}

Dieser Code zeigt nach oben Links genannt title YouTube Video-Link videoId Verwendung mit.

Quelle

2016-06-04 07:36:57

Das funktioniert! Ich sehe, dass Sie die Eigenschaften in der JSON-Antwort im Grunde durchgebohrt haben. Dies erzeugt Links für fünf Ergebnisse und zeigt sie perfekt an. Wie würde ich dies erweitern, um nur ein Ergebnis anzuzeigen? –

Ich habe meine Antwort verbessert, um anonyme Funktionen wiederverwenden zu können. Verwenden Sie einfach die 'itemToHtml'-Funktion mit einem bestimmten Element (z. B.' itemToHtml (response.items [0]) '). –

Wenn ich ** item ** durch ** response.items [0] ** ersetze, erhalte ich folgende Fehlermeldung: SyntaxError: Unexpected token '.'. Erwartet ein ')' oder ein ',' nach einer Parameterdeklaration. Gibt es ein Problem mit der Punktnotation in einer Funktionsdefinition? –

YouTube-API - Extrahieren von Titel- und videoId-Attributen zum Erstellen von Hyperlinks

Antwort

Verwandte Themen