Récupérer automatiquement l'image YouTube pour la miniature?
J'ai un type de message personnalisé qui accepte un extrait de code HTML intégré à YouTube, un titre et une image sélectionnée. Actuellement, je vais chercher une image pour l'image sélectionnée, mais idéalement, je serais capable de télécharger et de redimensionner automatiquement la première image de la vidéo elle-même en fonction de l'URL de la vidéo pendant le processus de sauvegarde de la publication elle-même. Si cela est fait correctement, mon type de message pourrait ne nécessiter rien de plus que le lien et pourrait en obtenir l'image et le code d'intégration.
Par exemple, si le lien vidéo est http://www.youtube.com/watch?v=2Jnpi-uBiIg la valeur de v serait extraite et utilisée pour télécharger l'image sur http://img.youtube.com/vi/2Jnpi-uBiIg/0.jpg .
Je suis très nouveau dans le développement wordpress, mais quelque chose me dit que je me lancerais dans des accrocs (si je les comprends bien).
Bonjour @ Jonathan Sampson:
Bien que ce ne soit pas exactement ce que vous avez demandé, il pourrait s’agir d’une solution viable et proposée gratuitement par WordPress.com grâce au tweet de @yoast de ce matin lorsqu’il a référencé ce blog. :
Fondamentalement, vous pouvez utiliser l'URL du générateur de capture d'écran de WordPress.com sous cette forme (qui, selon l'article du blog Matt semblait bénir un usage gratuit):
https://s.wordpress.com/mshots/v1/{URL-encoded URL}?w={width}
Donc, en prenant votre URL d'en haut:
Ensuite, le codage d’URL que vous pouvez utiliser avec le générateur de captures d’écran vous donne une URL ressemblant à ceci: (pour une largeur de 400 pixels):
https://s.wordpress.com/mshots/v1/http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D2Jnpi-uBiIg?w=400
Et bien sûr, voici ce que la capture d'écran ressemble à (j'ai copié la capture d'écran pour la postérité afin qu'elle ne change pas même si le service WordPress est modifié plutôt que d'inclure un lien direct vers le service pour afficher l'image.) Vous ne savez pas pourquoi la vidéo a été capturée et non la page entière, mais la vidéo est encore meilleure pour ce que vous voulez:
(source: mikeschinkel.com )
Bien sûr, la première fois que HTTP GET demande à l'URL, il ne renverra pas de capture d'écran car les serveurs de WordPress.com doivent d'abord capturer la capture d'écran, ce qui prend trop de temps pour laisser votre demande HTTP GET attendre. Donc, à la première demande, votre HTTP GET sera simplement redirigé vers cette URL:
https://s.wordpress.com/wp-content/plugins/mshots/default.gif
Et cette URL affiche cette image:
Mais si vous attendez une minute après votre première demande HTTP GET et émettez à nouveau la demande, vous trouverez votre capture d'écran. Je pense que ce que vous voudrez faire, c'est l'appeler pour le mettre en cache, attendre de le télécharger, puis le mettre en cache localement sur votre propre serveur afin de minimiser la charge de travail sur les serveurs de WordPress.com afin qu'ils ne repensent pas. en l'offrant gratuitement (ou alors, s'il y a suffisamment de trafic, ils pourraient même l'offrir en tant que service payant et peut-être ajouter des fonctionnalités d'API payantes aussi!)}
P.S. Au fait, pour prouver que cela fonctionne réellement dans une page Web, voici la capture d'écran demandée directement à WordPress.com. Notez que cela peut être différent de la capture d’écran que j’ai enregistrée et liée ci-dessus, ou bien cela fait longtemps que personne n’a visionné cette page et son cache est donc clairement défini, il peut même s'agir de l'image "Génération de prévisualisation" Si tel est le cas, attendez une minute, puis actualisez cette page. Elle devrait revenir:
Mon générateur de messages de blog vidéo (http://v.leau.co/) le fait, mais pas dans le contexte wp.
Vous fournissez une requête, par exemple. "superman" (puis attendez (sans préavis, il fait quelque chose (car je suis le seul utilisateur))), puis cliquez sur les vidéos que vous souhaitez publier, cliquez sur générer le code et vous avez le code où les vignettes sont hébergées sur mon site car il les a entre-temps téléchargés. Ce code peut être copié et collé dans un post.
En d'autres termes, si vous placez le code dans un appel de fonction, il renverra le morceau de code, par exemple. un href avec un lien vers la vidéo qui est ajouté au contenu ou par ex. le lien vers l'image sélectionnée téléchargée localement.
Est-ce le morceau de code que vous recherchez? Je pense que le noyau est:
Une fonction pour récupérer plus de résultats (par exemple si vous voulez seulement afficher plus d'une vidéo dans le code résultant au lieu de 1 spécifique):
function retrieveMoreResults($key, $q, $start, $cache) {
$url = "http://ajax.googleapis.com/ajax/services/search/video?v=1.0&q=" . $q . "&rsz=large&start=" . $start. "&key=" . $key;
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_REFERER, $referer);
$body = curl_exec($ch);
curl_close($ch);
$responseData = json_decode($body, true);
$tempOutputString .= display($responseData, $cache, $q);
return $tempOutputString;
}
Une fonction pour obtenir la page de résultats initiaux:
function retrieveResults($key, $q, $cache) {
# first call
$url = "http://ajax.googleapis.com/ajax/services/search/video?v=1.0&q=" . $q . "&rsz=large&key=" . $key;
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_REFERER, $referer);
$body = curl_exec($ch);
curl_close($ch);
$responseData = json_decode($body, true);
$tempOutputString = "";
$tempOutputString .= display($responseData, $cache, $q);
$boolFirstRequest = true;
foreach ($responseData["responseData"]["cursor"]["pages"] as $GsearchResultClass) {
$start = $GsearchResultClass["start"];
if ($boolFirstRequest) {
$boolFirstRequest = false;
} else {
$tempOutputString .= retrieveMoreResults($key, $q, $start, $cache);
}
}
return $tempOutputString;
}
Une fonction pour afficher télécharger les vignettes dans un certain répertoire (variable) et renvoyer un morceau de code à mettre dans le post:
function display($responseData, $cache, $tag) {
$strBuffer="";
foreach ($responseData["responseData"]["results"] as $GsearchResultClass) {
#
# there are YouTube urls and also Google Video urls they are both different
# the one from Google video has the Word "ThumbnailServer" in it
# example:
# youtube: http://1.gvt0.com/vi/6jKzr143K8U/default.jpg
# video.google: http://3.gvt0.com/ThumbnailServer2?app=vss&contentid=7efbd69963e4cc67&offsetms=30000&itag=w160&hl=en&sigh=J6N1fv_It6H5jJWX51fKt-eYqNk
#
$thumbId="";
$imageThumb=$GsearchResultClass["tbUrl"];
if (strstr($imageThumb, 'ThumbnailServer')) {
$imgStringBits = explode('&',$imageThumb);
$parsedImgStr=strstr($imgStringBits[1],'=');
$parsedImgStr = substr($parsedImgStr,1);
$thumbId = $parsedImgStr;
} else {
$imgStringBits = explode('/',$imageThumb);
$thumbId = $imgStringBits[4];
}
$imgFile=$cache . "/" . $thumbId . ".jpg";
#
# Now that we have the imageFile Name check if we already have it in the cache:
# - if we have it NEVER delete it (why should we?)
# - if we dont well... get it via curl
#
if (!file_exists($imgFile)) {
$ch = curl_init ();
$timeout = 5;
curl_setopt ($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (Windows; U; Windows NT 5.1; pl; rv:1.9) Gecko/2008052906 Firefox/3.0');
curl_setopt ($ch, CURLOPT_AUTOREFERER, true);
curl_setopt ($ch, CURLOPT_URL, $imageThumb);
curl_setopt ($ch, CURLOPT_HEADER, false);
curl_setopt ($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
curl_setopt ($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt ($ch, CURLOPT_BINARYTRANSFER, true);
curl_setopt ($ch, CURLOPT_VERBOSE, 1);
$rawdata = curl_exec ($ch);
curl_close ($ch);
if($rawdata) {
$fp = fopen($imgFile, 'w');
fwrite($fp, $rawdata);
fclose($fp);
} else {
#
# If our Curl action retrieves nothing then use the default image
#
$imgfile="images/default.jpg";
}
}
#
# Now that we have the image url create a div (hmm.. might drop that
# styling later on in a seperate csss) containg the video thumb, link
# and the description. When you like it you can add all the other
# parameters that Google returns like length etc...
#
$strBuffer .= "<div style=\"float:left;width:125px;height:130px;font-size:8px;font-family:arial;\" class=\"thumb\"><div>";
$strBuffer .= "<a href=\"#\" class=\"del\" id=\"$thumbId\"> ADD</a><br />";
$strBuffer .= "<a href=\"" . $GsearchResultClass["playUrl"] . "\" target=\"_blank\">";
$strBuffer .= "<img src=\"" . $imgFile . "\" alt=\"" . $GsearchResultClass["title"] . "\" border=\"0\" width=\"120\">";
$strBuffer .= "</a><br />\n";
#
# Note that we also add a delete option, for now that only removes it from the page
# but in the next version it should do an AJAX call to write the id somewhere so
# that we never see it again.
#
$strBuffer .= $GsearchResultClass["titleNoFormatting"] . "<br />";
$strBuffer .= "</div></div>\n";
}
return $strBuffer;
}
Une fonction pour appeler ce qui précède:
function moviePage($tag, $cacheName, $cacheTime, $key) {
$cache = $cacheName . "/" . $tag;
checkCache($cache);
cleanCacheHTML($cache);
$filename = $tag . ".html";
$spFile=$cache . "/" . $filename;
if (file_exists($spFile) && filemtime($spFile) > $cacheTime ) {
$strBuffer = file_get_contents($spFile) . "<!-- " . $spFile . " from cache -->";
} else {
$strBuffer = retrieveResults($key, $tag, $cache);
}
$strBuffer .= "<br clear=\"all\">";
$fp = fopen($spFile, 'w');
fwrite($fp, $strBuffer);
fclose($fp);
return $strBuffer;
}
(la clé $ est votre clé API Google) (http://code.google.com/intl/nl-NL/more/)
IMHO, je pense que le reste est plus simplement "récupérer le contenu renvoyé et l'ajouter au contenu d'un post + définir le pouce mis en cache téléchargé tel qu'il est présenté?"
P.S. À mon humble avis, il est toujours préférable de poster une vignette dans une vidéo lorsque vous faites référence à des vidéos YouTube, car les vidéos les plus anciennes sont souvent supprimées par YouTube, ce qui entraîne la publication de messages déplaisants. Au moins, avec vos propres pouces, l'image y reste pour toujours, de sorte que vous aurez ensuite un indice sur ce que vous avez posté à l'origine.
Je ne sais pas si j'ai compris exactement ce que vous voulez dire, mais j'ai trouvé cette solution de contournement:
http://wpworks.wordpress.com/2010/12/23/display-youtube-thumbnail-with-wordpress-custom-field/
Meilleures salutations
Fonction pour afficher l'image en fonction de l'URL? Est-ce le genre de chose que vous aviez en tête?
function get_youtube_screen( $url = '', $type = 'default', $echo = true ) {
if( empty( $url ) )
return false;
if( !isset( $type ) )
$type = '';
$url = esc_url( $url );
preg_match("|[\\?&]v=([^&#]*)|",$url,$vid_id);
if( !isset( $vid_id[1] ) )
return false;
$img_server_num = 'i'. Rand(1,4);
switch( $type ) {
case 'large':
$img = "<img src=\"http://{$img_server_num}.ytimg.com/vi/{$vid_id[1]}/0.jpg\" />";
break;
case 'first':
// Thumbnail of the first frame
$img = "<img src=\"http://{$img_server_num}.ytimg.com/vi/{$vid_id[1]}/1.jpg\" />";
break;
case 'small':
// Thumbnail of a later frame(i'm not sure how they determine this)
$img = "<img src=\"http://{$img_server_num}.ytimg.com/vi/{$vid_id[1]}/2.jpg\" />";
break;
case 'default':
case '':
default:
$img = "<img src=\"http://{$img_server_num}.ytimg.com/vi/{$vid_id[1]}/default.jpg\" />";
break;
}
if( $echo )
echo $img;
else
return $img;
}
// Example calls
get_youtube_screen( "http://www.youtube.com/watch?v=dZfmPREbTd8", 'default' );
get_youtube_screen( "http://www.youtube.com/watch?v=dZfmPREbTd8", 'large' );
get_youtube_screen( "http://www.youtube.com/watch?v=dZfmPREbTd8", 'small' );
get_youtube_screen( "http://www.youtube.com/watch?v=dZfmPREbTd8", 'first' );
YouTube semble proposer des images à quelques serveurs pour les vignettes.
iN.ytimg.com
Où N est généralement une valeur numérique comprise entre 1 et 4 (5 parfois mais sans concordance dans les tests).
Ils utilisent également img.youtube.com, mais j’ai aimé l’idée de récupérer des serveurs en alternance, c’est pourquoi j’ai codé la fonction pour qu’elle choisisse au hasard l’un des quatre serveurs pour afficher l’image.
REMARQUE: Il n'y a pas toujours une image pour chacune des tailles de chaque vidéo; certaines apparaîtront simplement vierges, mais l'image par défaut semble fonctionner de manière cohérente dans les URL de vidéo que j'ai testées.
Dis moi si ça aide..