Obtenir des vignettes img de Vimeo?
Je souhaite obtenir une vignette pour les vidéos de Vimeo.
Lorsque j'obtiens des images de Youtube, je fais comme ceci:
http://img.youtube.com/vi/HwP5NG-3e8I/2.jpg
Une idée de comment faire pour Vimeo?
À partir de la documentation de l'API Vimeo Simple :
Faire une demande de vidéo
Pour obtenir des données sur une vidéo spécifique, utilisez l'URL suivante:
http://vimeo.com/api/v2/video/video_id.output
video_id L'ID de la vidéo pour laquelle vous souhaitez obtenir des informations.
output Spécifiez le type de sortie. Nous proposons actuellement les formats JSON, PHP et XML.
Donc, obtenir cette URL http://vimeo.com/api/v2/video/6271487.xml
<videos>
<video>
[skipped]
<thumbnail_small>http://ts.vimeo.com.s3.amazonaws.com/235/662/23566238_100.jpg</thumbnail_small>
<thumbnail_medium>http://ts.vimeo.com.s3.amazonaws.com/235/662/23566238_200.jpg</thumbnail_medium>
<thumbnail_large>http://ts.vimeo.com.s3.amazonaws.com/235/662/23566238_640.jpg</thumbnail_large>
[skipped]
</videos>
Analyser cette pour chaque vidéo pour obtenir la vignette
Voici le code approximatif en PHP
<?php
$imgid = 6271487;
$hash = unserialize(file_get_contents("http://vimeo.com/api/v2/video/$imgid.php"));
echo $hash[0]['thumbnail_medium'];
En javascript (utilise jQuery):
function vimeoLoadingThumb(id){
var url = "http://vimeo.com/api/v2/video/" + id + ".json?callback=showThumb";
var id_img = "#vimeo-" + id;
var script = document.createElement( 'script' );
script.src = url;
$(id_img).before(script);
}
function showThumb(data){
var id_img = "#vimeo-" + data[0].id;
$(id_img).attr('src',data[0].thumbnail_medium);
}
Pour l'afficher:
<img id="vimeo-{{ video.id_video }}" src="" alt="{{ video.title }}" />
<script type="text/javascript">
vimeoLoadingThumb({{ video.id_video }});
</script>
Utilisation de la requête jQuery jsonp:
<script type="text/javascript">
$.ajax({
type:'GET',
url: 'http://vimeo.com/api/v2/video/' + video_id + '.json',
jsonp: 'callback',
dataType: 'jsonp',
success: function(data){
var thumbnail_src = data[0].thumbnail_large;
$('#thumb_wrapper').append('<img src="' + thumbnail_src + '"/>');
}
});
</script>
<div id="thumb_wrapper"></div>
Vous devriez analyser la réponse de l'API de Vimeo. Il n’ya aucun moyen de le faire avec des appels d’URL (comme dailymotion ou youtube).
Voici ma solution PHP:
/**
* Gets a vimeo thumbnail url
* @param mixed $id A vimeo id (ie. 1185346)
* @return thumbnail's url
*/
function getVimeoThumb($id) {
$data = file_get_contents("http://vimeo.com/api/v2/video/$id.json");
$data = json_decode($data);
return $data[0]->thumbnail_medium;
}
Avec Ruby, vous pouvez faire ce qui suit si vous avez, par exemple:
url = "http://www.vimeo.com/7592893"
vimeo_video_id = url.scan(/vimeo.com\/(\d+)\/?/).flatten.to_s # extract the video id
vimeo_video_json_url = "http://vimeo.com/api/v2/video/%s.json" % vimeo_video_id # API call
# Parse the JSON and extract the thumbnail_large url
thumbnail_image_location = JSON.parse(open(vimeo_video_json_url).read).first['thumbnail_large'] rescue nil
Voici un exemple montrant comment faire la même chose dans ASP.NET en utilisant C #. N'hésitez pas à utiliser une autre image d'erreur de capture :)
public string GetVimeoPreviewImage(string vimeoURL)
{
try
{
string vimeoUrl = System.Web.HttpContext.Current.Server.HtmlEncode(vimeoURL);
int pos = vimeoUrl.LastIndexOf(".com");
string videoID = vimeoUrl.Substring(pos + 4, 8);
XmlDocument doc = new XmlDocument();
doc.Load("http://vimeo.com/api/v2/video/" + videoID + ".xml");
XmlElement root = doc.DocumentElement;
string vimeoThumb = root.FirstChild.SelectSingleNode("thumbnail_medium").ChildNodes[0].Value;
string imageURL = vimeoThumb;
return imageURL;
}
catch
{
//cat with cheese on it's face fail
return "http://bestofepicfail.com/wp-content/uploads/2008/08/cheese_fail.jpg";
}
}
REMARQUE: votre demande d'API devrait ressembler à ceci: http://vimeo.com/api/v2/video/32660708.xml
La méthode JavaScript la plus simple que j'ai trouvée pour obtenir la vignette, sans rechercher l'id de la vidéo, est d'utiliser:
//Get the video thumbnail via Ajax
$.ajax({
type:'GET',
url: 'https://vimeo.com/api/oembed.json?url=' + encodeURIComponent(url),
dataType: 'json',
success: function(data) {
console.log(data.thumbnail_url);
}
});
Remarque: si quelqu'un doit obtenir la vignette de la vidéo associée à l'identifiant de la vidéo, il peut remplacer le $id par l'identifiant de la vidéo et obtenir un code XML contenant les détails de la vidéo:
http://vimeo.com/api/v2/video/$id.xml
Exemple:
http://vimeo.com/api/v2/video/198340486.xml
Si vous souhaitez utiliser des miniatures en mode js/jquery no api pur, vous pouvez utiliser cet outil pour capturer une image de la vidéo et le tour est joué! Insérez votre pouce dans la source de votre choix.
Voici un stylo code:
<img src="https://i.vimeocdn.com/video/531141496_640.jpg"` alt="" />
Voici le site pour obtenir une miniature:
Utilisation de l’URL Vimeo ( https://player.vimeo.com/video/30572181 ), voici mon exemple
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<title>Vimeo</title>
</head>
<body>
<div>
<img src="" id="thumbImg">
</div>
<script>
$(document).ready(function () {
var vimeoVideoUrl = 'https://player.vimeo.com/video/30572181';
var match = /vimeo.*\/(\d+)/i.exec(vimeoVideoUrl);
if (match) {
var vimeoVideoID = match[1];
$.getJSON('http://www.vimeo.com/api/v2/video/' + vimeoVideoID + '.json?callback=?', { format: "json" }, function (data) {
featuredImg = data[0].thumbnail_large;
$('#thumbImg').attr("src", featuredImg);
});
}
});
</script>
</body>
</html>Il semble qu'api/v2 soit mort.
Pour utiliser la nouvelle API, vous devez enregistrer votre application , et en base64 coder client_id et client_secret en tant qu’en-tête d’autorisation.
$.ajax({
type:'GET',
url: 'https://api.vimeo.com/videos/' + video_id,
dataType: 'json',
headers: {
'Authorization': 'Basic ' + window.btoa(client_id + ":" + client_secret);
},
success: function(data) {
var thumbnail_src = data.pictures.sizes[2].link;
$('#thumbImg').attr('src', thumbnail_src);
}
});
Pour des raisons de sécurité, vous pouvez renvoyer les client_id et client_secret déjà codés à partir du serveur.
function parseVideo(url) {
// - Supported YouTube URL formats:
// - http://www.youtube.com/watch?v=My2FRPA3Gf8
// - http://youtu.be/My2FRPA3Gf8
// - https://youtube.googleapis.com/v/My2FRPA3Gf8
// - Supported Vimeo URL formats:
// - http://vimeo.com/25451551
// - http://player.vimeo.com/video/25451551
// - Also supports relative URLs:
// - //player.vimeo.com/video/25451551
url.match(/(http:|https:|)\/\/(player.|www.)?(vimeo\.com|youtu(be\.com|\.be|be\.googleapis\.com))\/(video\/|embed\/|watch\?v=|v\/)?([A-Za-z0-9._%-]*)(\&\S+)?/);
if (RegExp.$3.indexOf('youtu') > -1) {
var type = 'youtube';
} else if (RegExp.$3.indexOf('vimeo') > -1) {
var type = 'vimeo';
}
return {
type: type,
id: RegExp.$6
};
}
function getVideoThumbnail(url, cb) {
var videoObj = parseVideo(url);
if (videoObj.type == 'youtube') {
cb('//img.youtube.com/vi/' + videoObj.id + '/maxresdefault.jpg');
} else if (videoObj.type == 'vimeo') {
$.get('http://vimeo.com/api/v2/video/' + videoObj.id + '.json', function(data) {
cb(data[0].thumbnail_large);
});
}
}
En fait, le gars qui a posé cette question a posté sa propre réponse.
"Vimeo semble vouloir que je fasse une requête HTTP et que j'extrais l'URL miniature du XML qu'ils renvoient ..."
Les documents de l'API Vimeo sont ici: http://vimeo.com/api/docs/simple-api
En bref, votre application doit envoyer une requête GET à une URL du type suivant:
http://vimeo.com/api/v2/video/video_id.output
et analyser les données renvoyées pour obtenir l'URL de vignette dont vous avez besoin, puis téléchargez le fichier à cette URL.
C’est un moyen astucieux de le faire, mais aussi un moyen de choisir une taille personnalisée.
Je vais ici:
http://vimeo.com/api/v2/video/[VIDEO ID].php
Téléchargez le fichier, ouvrez-le et recherchez la vignette de 640 pixels de large, le format sera le suivant:
https://i.vimeocdn.com/video/[LONG NUMBER HERE]_640.jpg
Vous prenez le lien, changez le 640 pour - par exemple - 1400, et vous vous retrouvez avec quelque chose comme ceci:
https://i.vimeocdn.com/video/[LONG NUMBER HERE]_1400.jpg
Collez-le dans la barre de recherche de votre navigateur et profitez-en.
À votre santé,
J'ai écrit une fonction dans PHP pour me laisser faire cela, j'espère que cela sera utile à quelqu'un. Le chemin d'accès à la vignette est contenu dans une balise de lien sur la page vidéo. Cela semble faire l'affaire pour moi.
$video_url = "http://vimeo.com/7811853"
$file = fopen($video_url, "r");
$filedata = stream_get_contents($file);
$html_content = strpos($filedata,"<link rel=\"videothumbnail");
$link_string = substr($filedata, $html_content, 128);
$video_id_array = explode("\"", $link_string);
$thumbnail_url = $video_id_array[3];
echo $thumbnail_url;
J'espère que ça aide quelqu'un.
Foggson
Décomposer la réponse de Karthikeyan P pour qu'il puisse être utilisé dans un plus large éventail de scénarios:
// Requires jQuery
function parseVimeoIdFromUrl(vimeoUrl) {
var match = /vimeo.*\/(\d+)/i.exec(vimeoUrl);
if (match)
return match[1];
return null;
};
function getVimeoThumbUrl(vimeoId) {
var deferred = $.Deferred();
$.ajax(
'//www.vimeo.com/api/v2/video/' + vimeoId + '.json',
{
dataType: 'jsonp',
cache: true
}
)
.done(function (data) {
// .thumbnail_small 100x75
// .thumbnail_medium 200x150
// 640 wide
var img = data[0].thumbnail_large;
deferred.resolve(img);
})
.fail(function(a, b, c) {
deferred.reject(a, b, c);
});
return deferred;
};
Usage
Obtenir un identifiant Vimeo à partir d'une URL de vidéo Vimeo:
var vimeoId = parseVimeoIdFromUrl(vimeoUrl);
Obtenir une URL miniature de vimeo à partir d'un identifiant Vimeo:
getVimeoThumbUrl(vimeoIds[0])
.done(function(img) {
$('div').append('<img src="' + img + '"/>');
});
function getVimeoInfo($link)
{
if (preg_match('~^http://(?:www\.)?vimeo\.com/(?:clip:)?(\d+)~', $link, $match))
{
$id = $match[1];
}
else
{
$id = substr($link,10,strlen($link));
}
if (!function_exists('curl_init')) die('CURL is not installed!');
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, "http://vimeo.com/api/v2/video/$id.php");
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_TIMEOUT, 10);
$output = unserialize(curl_exec($ch));
$output = $output[0];
curl_close($ch);
return $output;
}`
// en dessous de la fonction passe l'URL de la vignette.
function save_image_local($thumbnail_url)
{
//for save image at local server
$filename = time().'_hbk.jpg';
$fullpath = '../../app/webroot/img/videos/image/'.$filename;
file_put_contents ($fullpath,file_get_contents($thumbnail_url));
return $filename;
}
Si vous n'avez pas besoin d'une solution automatisée, vous pouvez trouver l'URL de la vignette en entrant l'ID de vimeo ici: http://video.depone.eu/
PDATE: Cette solution a cessé de fonctionner à compter de décembre 2018.
Je cherchais la même chose et il semble que la plupart des réponses ici sont obsolètes à cause de l’abandon de Vimeo API v2.
mon php 2 ¢:
$vidID = 12345 // Vimeo Video ID
$tnLink = json_decode(file_get_contents('https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/' . $vidID))->thumbnail_url;
avec ce qui précède, vous obtiendrez le lien vers la vignette par défaut de Vimeo.
Si vous souhaitez utiliser une image de taille différente, vous pouvez ajouter quelque chose comme:
$tnLink = substr($tnLink, strrpos($tnLink, '/') + 1);
$tnLink = substr($tnLink, 0, strrpos($tnLink, '_')); // You now have the thumbnail ID, which is different from Video ID
// And you can use it with link to one of the sizes of crunched by Vimeo thumbnail image, for example:
$tnLink = 'https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2F' . $tnLink . '_1280x720.jpg&src1=https%3A%2F%2Ff.vimeocdn.com%2Fimages_v6%2Fshare%2Fplay_icon_overlay.png';
Si vous recherchez une solution alternative et que vous pouvez gérer le compte vimeo, vous pouvez ajouter toutes les vidéos que vous souhaitez afficher dans un album, puis utiliser l'API pour demander les détails de l'album. Il affiche ensuite toutes les vignettes et tous les liens. . Ce n'est pas idéal mais pourrait aider.
point final API (terrain de jeu)
Twitter convo avec @ vimeoapi
Vous voudrez peut-être jeter un coup d'œil au joyau de Matt Hooks. https://github.com/matthooks/vimeo
Il fournit un wrapper vimeo simple pour l’API.
Tout ce dont vous avez besoin est de stocker video_id (et le fournisseur si vous utilisez également d'autres sites vidéo)
Vous pouvez extraire l'identifiant de la vidéo vimeo comme ceci
def
get_vimeo_video_id (link)
vimeo_video_id = nil
vimeo_regex = /http:\/\/(www\.)?vimeo.com\/(\d+)($|\/)/
vimeo_match = vimeo_regex.match(link)
if vimeo_match.nil?
vimeo_regex = /http:\/\/player.vimeo.com\/video\/([a-z0-9-]+)/
vimeo_match = vimeo_regex.match(link)
end
vimeo_video_id = vimeo_match[2] unless vimeo_match.nil?
return vimeo_video_id
end
et si vous avez besoin de votre tube, vous trouverez peut-être cela utile
def
get_youtube_video_id (link)
youtube_video_id = nil
youtube_regex = /^(https?:\/\/)?(www\.)?youtu.be\/([A-Za-z0-9._%-]*)(\&\S+)?/
youtube_match = youtube_regex.match(link)
if youtube_match.nil?
youtubecom_regex = /^(https?:\/\/)?(www\.)?youtube.com\/watch\?v=([A-Za-z0-9._%-]*)(\&\S+)?/
youtube_match = youtubecom_regex.match(link)
end
youtube_video_id = youtube_match[3] unless youtube_match.nil?
return youtube_video_id
end
Pour quelqu'un comme moi qui essaie de comprendre cela récemment,
https://i.vimeocdn.com/video/[video_id]_[dimension].webp fonctionne pour moi.
(où dimension = 200x150 | 640)