Javascript 如何使用函数发出api get请求？

我正在尝试使用Axios调用dog.ceo api生成一个新的、随机的狗图像，下面是品种名称，由链接到我的按钮的

genNewImage（）

函数发出，这是我的javascript：

函数genNewImage（）{ axios.get（）https://dog.ceo/api/breeds/image/random“）//这就是我调用的api。 。然后（（正文）=>{ var url=body.data.message； var image=document.getElementById（“dogImg”）； var dogText=document.getElementById（“dogText”）； var urlCutter=url.split（'/'）[4].split（'-'）；//从检索到的url获取品种名称 var first=urlCutter[1]。charAt（0）。toUpperCase（）+urlCutter[1]。split（“”）。slice（1，urlCutter[1]。length）。join（“”；//获取品种名称的第一部分并大写第一个字母。 var second=urlCutter[0].charAt（0）.toUpperCase（）+urlCutter[0].split（“”）.slice（1，urlCutter[0].length.join（“”；//获取品种名称的第二部分并大写第一个字母。 image.src=url；//设置图像对象的src dogText.innerHTML=“这是一个：“+first+”“+second；//在段落中设置狗的品种名称 }) .catch（（错误）=>{ console.log（'Error'，errr.statusCode）； }) };

单击以查看随机图像
这是一个：

问题不是代码本身，而是语义问题

考虑这两个示例URL

一行一行地浏览你的代码，你会发现当你试图获得品种的名字时，问题就出现了。您可以在索引1处访问拆分的URL数组。用“-”分隔符拆分数组。如果URL（品种）不像第二个URL那样包含“-”，将抛出一个错误，因为索引1处的数组未定义。因此，在使用索引1处的值之前，请检查它是否已设置。这将使您的代码运行

错误消息还指示变量未定义

函数genNewImage（）{ axios.get（）https://dog.ceo/api/breeds/image/random') 。然后（（正文）=>{ 让url=body.data.message； 让image=document.getElementById（“dogImg”）； 让dogText=document.getElementById（“dogText”）； 让urlCutter=url.split（'/'）[4].split（'-'）； 让first=typeof（urlCutter[1]）=='undefined'？“”：urlCutter[1]。字符（0）。toUpperCase（）+urlCutter[1]。拆分（“”）。切片（1，urlCutter[1]。长度）。连接（“”）；； 设second=urlCutter[0].charAt（0）.toUpperCase（）+urlCutter[0].split（“”）.slice（1，urlCutter[0].length.join（“”）； image.src=url；//设置图像对象的src dogText.innerHTML=“这是一个：“+first+”“+second；//在段落中设置狗的品种名称 }) .catch（错误=>{ console.log（error.response） }); }

单击以查看随机图像
这是一个：

有什么错误？您是否导入了unpkg.com/axios/dist/axios.min.js“>；我导入并检查了它worked@ArunKumarMohan错误消息为“初始化前无法访问'axios'“感谢您解决了我的api调用有时会带着奇怪的数据返回而不加载的问题，我想知道是什么导致了这一问题。出于某种原因，即使将代码粘贴到中似乎也无法解决问题，我收到一条错误消息：“初始化之前无法访问‘axios’”我使用npm将其安装到我的根目录，并使用require将其添加到包含函数的javascript文件中，但它仍然不起作用。那么，您是在node中使用它还是在html文件中使用它？如果第二种情况是，您必须使用类似于我的代码段中的脚本引用axios。我有一个中心app.js文件，该文件使用此函数的副本和app.get最初呈现页面，我还有另一个js文件中的函数版本，我使用脚本标记链接到html文件。我可以看出它们链接正确，因为js文件中的其他函数在我的html中可以完美地工作。我的html中的脚本标记如下：

你是说我需要在脚本标记本身中引用Axios吗？这是我第一次尝试在node中构建一些东西，所以我真的不确定我在做什么。无论我做什么，我都会收到一条错误消息“在初始化之前无法访问'axios'”不，我已经弄明白了，我有两个同名的常量，它现在工作得很好，谢谢！