使用 Tenor GIF Api。我收到此错误，只有大约 10% 的时间，其他 90% 的时间有效：
捕获类型错误：无法读取未定义的属性（读取“media_formats”）
var response_objects = JSON.parse(responsetext);
top_10_gifs = response_objects["results"];
var index = getRandomInt(10);
var image = document.getElementById("share_gif");
image.src = top_10_gifs[index]["media_formats"]["gif"]["url"];
var dimX = top_10_gifs[index]["media_formats"]["gif"]["dims"][0];
var dimY = top_10_gifs[index]["media_formats"]["gif"]["dims"][1];
return;
它在尝试读取第一个 ['media_formats'] 时抛出错误，说它无法读取未定义的内容。
但是，对象已加载，如果我在该行之前控制台记录对象，它将有一个对象。由于某种原因，只有一小部分时间是未定义的。
不确定为什么要这样做。谢谢
您可以使用这样的函数从数组中选择一个伪随机元素：
function getRandomElement(array) {
return array[Math.floor(Math.random() * array.length)];
}
下面是一个代码示例来提供帮助。它使用通过使用 API 文档中的示例查询在Trending GIFs端点获得的有效负载。
务必阅读 API 文档以了解响应的结构。
function getRandomElement(array) {
return array[Math.floor(Math.random() * array.length)];
}
/** @see https://tenor.com/gifapi/documentation#responseobjects-gif */
function extractGifProperties(gifObject) {
const firstMediaObject = gifObject.media[0]?.gif;
if (!firstMediaObject) throw new Error("Object has no media");
const { dims: [x, y], url } = firstMediaObject;
return { url, x, y };
}
const exampleJsonResponse = `{"locale":"en","results":[{"id":"18362005","title":"","content_description":"Riding Ride GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[498,373],"url":"https://media.tenor.com/i5_1W_8TSCwAAAAC/riding-ride.gif","preview":"https://media.tenor.com/i5_1W_8TSCwAAAAD/riding-ride.png","size":692155}}],"bg_color":"","created":1599383710.072795,"itemurl":"https://tenor.com/view/riding-ride-em-kentucky-derby-gif-18362005","url":"https://tenor.com/bpcXx.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"11877851","title":"fascinator hat","content_description":"Fascinator Hat GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[400,224],"size":1029336,"preview":"https://media.tenor.com/HZ0WxfZCCzUAAAAD/fascinator-hat.png","url":"https://media.tenor.com/HZ0WxfZCCzUAAAAC/fascinator-hat.gif"}}],"bg_color":"","created":1527135800.757915,"itemurl":"https://tenor.com/view/fascinator-hat-fascinator-hat-derby-hat-kentucky-derby-hat-gif-11877851","url":"https://tenor.com/XZ8p.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"25733140","title":"","content_description":"Congratulations Graduates GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[498,490],"preview":"https://media.tenor.com/Gav-54IlnzoAAAAD/congratulations-graduates.png","url":"https://media.tenor.com/Gav-54IlnzoAAAAC/congratulations-graduates.gif","size":1690200}}],"bg_color":"","created":1653070690.161676,"itemurl":"https://tenor.com/view/congratulations-graduates-2022-smile-thumbs-gif-25733140","url":"https://tenor.com/bT8wO.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"25612481","title":"","content_description":"Happy Nurses Day Nurses Week2022 GIF","content_rating":"","h1_title":"","media":[{"gif":{"preview":"https://media.tenor.com/9eFhF10aFk8AAAAD/happy-nurses-day-nurses-week2022.png","size":1705147,"url":"https://media.tenor.com/9eFhF10aFk8AAAAC/happy-nurses-day-nurses-week2022.gif","dims":[498,498]}}],"bg_color":"","created":1651905045.451034,"itemurl":"https://tenor.com/view/happy-nurses-day-nurses-week2022-gif-25612481","url":"https://tenor.com/bTC8H.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"20131689","title":"","content_description":"Nurse GIF","content_rating":"","h1_title":"","media":[{"gif":{"url":"https://media.tenor.com/9R-hX7LdYNgAAAAC/nurse.gif","size":8683504,"preview":"https://media.tenor.com/9R-hX7LdYNgAAAAD/nurse.png","dims":[396,498]}}],"bg_color":"","created":1611786335.480743,"itemurl":"https://tenor.com/view/nurse-gif-20131689","url":"https://tenor.com/bwDkP.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"4952882","title":"Probably... - Jimmy Fallon","content_description":"Probably... - Jimmy Fallon GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[360,202],"preview":"https://media.tenor.com/sgpv_xrzl1kAAAAD/probably-jimmy-fallon.png","size":287873,"url":"https://media.tenor.com/sgpv_xrzl1kAAAAC/probably-jimmy-fallon.gif"}}],"bg_color":"#312b16","created":1453218819.305683,"itemurl":"https://tenor.com/view/probably-jimmy-fallon-probably-so-late-night-talk-show-gif-4952882","url":"https://tenor.com/uWDm.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"20573934","title":"","content_description":"Maury Lie GIF","content_rating":"","h1_title":"","media":[{"gif":{"preview":"https://media.tenor.com/S7o7J22Ug6gAAAAD/maury-lie.png","size":1240277,"dims":[498,351],"url":"https://media.tenor.com/S7o7J22Ug6gAAAAC/maury-lie.gif"}}],"bg_color":"","created":1614641701.426476,"itemurl":"https://tenor.com/view/maury-lie-detector-truth-gif-20573934","url":"https://tenor.com/byunO.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"11914056","title":"","content_description":"Vacation Beach GIF","content_rating":"","h1_title":"","media":[{"gif":{"preview":"https://media.tenor.com/86M19TSvg5wAAAAD/vacation-beach.png","dims":[354,498],"url":"https://media.tenor.com/86M19TSvg5wAAAAC/vacation-beach.gif","size":1740550}}],"bg_color":"","created":1527713768.214871,"itemurl":"https://tenor.com/view/vacation-beach-palmtree-island-tropical-gif-11914056","url":"https://tenor.com/X9ym.gif","tags":[],"flags":[],"shares":1,"hasaudio":true,"hascaption":false,"source_id":"","composite":null},{"id":"12894208","title":"","content_description":"Rowan Atkinson Crown GIF","content_rating":"","h1_title":"","media":[{"gif":{"size":1284039,"preview":"https://media.tenor.com/vkNNRDGgVyIAAAAD/rowan-atkinson-crown.png","url":"https://media.tenor.com/vkNNRDGgVyIAAAAC/rowan-atkinson-crown.gif","dims":[434,480]}}],"bg_color":"","created":1542331771.337598,"itemurl":"https://tenor.com/view/rowan-atkinson-crown-crowing-king-mr-bean-gif-12894208","url":"https://tenor.com/2gxg.gif","tags":[],"flags":[],"shares":1,"hasaudio":true,"hascaption":false,"source_id":"","composite":null},{"id":"21617044","title":"","content_description":"Eurovision2021 Esc2021 GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[498,305],"preview":"https://media.tenor.com/qFg0O1EY-tUAAAAD/eurovision2021-esc2021.png","url":"https://media.tenor.com/qFg0O1EY-tUAAAAC/eurovision2021-esc2021.gif","size":3016431}}],"bg_color":"","created":1621421522.757008,"itemurl":"https://tenor.com/view/eurovision2021-esc2021-eurovision-esc-esc2022-gif-21617044","url":"https://tenor.com/bCRKa.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"12737723","title":"","content_description":"Meme Funny GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[286,200],"size":94453,"preview":"https://media.tenor.com/oliG35OmL8oAAAAD/meme-funny.png","url":"https://media.tenor.com/oliG35OmL8oAAAAC/meme-funny.gif"}}],"bg_color":"","created":1540145260.515944,"itemurl":"https://tenor.com/view/meme-funny-gif-12737723","url":"https://tenor.com/1BPj.gif","tags":[],"flags":[],"shares":1,"hasaudio":true,"hascaption":false,"source_id":"","composite":null},{"id":"20756900","title":"","content_description":"Honeycardi GIF","content_rating":"","h1_title":"","media":[{"gif":{"preview":"https://media.tenor.com/6iPz_tx_FWwAAAAD/honeycardi.png","dims":[498,498],"size":4681711,"url":"https://media.tenor.com/6iPz_tx_FWwAAAAC/honeycardi.gif"}}],"bg_color":"","created":1615840348.277114,"itemurl":"https://tenor.com/view/honeycardi-gif-20756900","url":"https://tenor.com/bzfYS.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"17009888","title":"","content_description":"Friends Best Friends GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[498,498],"url":"https://media.tenor.com/D5j9wmeBnNEAAAAC/friends-best-friends.gif","size":916834,"preview":"https://media.tenor.com/D5j9wmeBnNEAAAAD/friends-best-friends.png"}}],"bg_color":"","created":1587879474.619193,"itemurl":"https://tenor.com/view/friends-best-friends-having-a-friend-like-you-is-priceless-gif-17009888","url":"https://tenor.com/bjxdc.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"15307671","title":"","content_description":"Taco Time Dancing GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[286,498],"url":"https://media.tenor.com/WfPqwlGNOsUAAAAC/taco-time-dancing.gif","preview":"https://media.tenor.com/WfPqwlGNOsUAAAAD/taco-time-dancing.png","size":3501360}}],"bg_color":"","created":1571189538.525299,"itemurl":"https://tenor.com/view/taco-time-dancing-nido-drums-drums-gif-15307671","url":"https://tenor.com/bcon5.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"18961518","title":"","content_description":"Fish GIF","content_rating":"","h1_title":"","media":[{"gif":{"url":"https://media.tenor.com/34rdAROzAQsAAAAC/fish.gif","preview":"https://media.tenor.com/34rdAROzAQsAAAAD/fish.png","dims":[498,348],"size":881917}}],"bg_color":"","created":1603768655.896917,"itemurl":"https://tenor.com/view/fish-gif-18961518","url":"https://tenor.com/brIU6.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"18125358","title":"","content_description":"Meme Yugioh GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[498,350],"url":"https://media.tenor.com/21S1aJvKD9UAAAAC/meme-yugioh.gif","preview":"https://media.tenor.com/21S1aJvKD9UAAAAD/meme-yugioh.png","size":2142713}}],"bg_color":"","created":1597553062.920117,"itemurl":"https://tenor.com/view/meme-yugioh-anime-cartas-yami-gif-18125358","url":"https://tenor.com/bodoE.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"16557937","title":"","content_description":"Be The Light Darkness To Light GIF","content_rating":"","h1_title":"","media":[{"gif":{"url":"https://media.tenor.com/_RfAI2hfItoAAAAC/be-the-light-darkness-to-light.gif","preview":"https://media.tenor.com/_RfAI2hfItoAAAAD/be-the-light-darkness-to-light.png","size":9985015,"dims":[498,498]}}],"bg_color":"","created":1583964534.465082,"itemurl":"https://tenor.com/view/be-the-light-darkness-to-light-everything-is-connected-love-and-light-blessed-be-gif-16557937","url":"https://tenor.com/bhDDF.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"13967115","title":"","content_description":"Macedonia Macedonia Is Greek GIF","content_rating":"","h1_title":"","media":[{"gif":{"dims":[480,480],"preview":"https://media.tenor.com/5e9U1oDOSrIAAAAD/macedonia-macedonia-is-greek.png","size":2174073,"url":"https://media.tenor.com/5e9U1oDOSrIAAAAC/macedonia-macedonia-is-greek.gif"}}],"bg_color":"","created":1555708885.461171,"itemurl":"https://tenor.com/view/macedonia-macedonia-is-greek-macedonian-star-vergina-pella-gif-13967115","url":"https://tenor.com/6LEd.gif","tags":[],"flags":[],"shares":1,"hasaudio":true,"hascaption":false,"source_id":"","composite":null},{"id":"17060441","title":"","content_description":"Cinco De Mayo Happy Cinco De Mayo GIF","content_rating":"","h1_title":"","media":[{"gif":{"url":"https://media.tenor.com/VQCKbMN4IjAAAAAC/cinco-de-mayo-happy-cinco-de-mayo.gif","dims":[498,498],"size":302326,"preview":"https://media.tenor.com/VQCKbMN4IjAAAAAD/cinco-de-mayo-happy-cinco-de-mayo.png"}}],"bg_color":"","created":1588279889.435228,"itemurl":"https://tenor.com/view/cinco-de-mayo-happy-cinco-de-mayo-mexico-5th-of-may-fifth-of-may-gif-17060441","url":"https://tenor.com/bjKmz.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null},{"id":"21438393","title":"","content_description":"Dancing Cinco GIF","content_rating":"","h1_title":"","media":[{"gif":{"preview":"https://media.tenor.com/fqOhkgayXxoAAAAD/dancing-cinco.png","size":3740089,"dims":[336,498],"url":"https://media.tenor.com/fqOhkgayXxoAAAAC/dancing-cinco.gif"}}],"bg_color":"","created":1620230573.113449,"itemurl":"https://tenor.com/view/dancing-cinco-de-mayo-celebration-gif-21438393","url":"https://tenor.com/bB7gH.gif","tags":[],"flags":[],"shares":1,"hasaudio":false,"hascaption":false,"source_id":"","composite":null}],"next":"1683294157.535297"}`;
const data = JSON.parse(exampleJsonResponse);
const first10Results = data.results.slice(0, 10);
const gifObject = getRandomElement(first10Results);
if (!gifObject) throw new Error("Results array was empty");
const properties = extractGifProperties(gifObject);
console.log(properties);