使用 Javascript 检查字符串是否是有效的图像 URL答案

【问题标题】：Check if a string is a valid image URL with Javascript使用 Javascript 检查字符串是否是有效的图像 URL
【发布时间】：2020-09-20 15:22:13
【问题描述】：

我尽我所能使用一些 npm api 来了解字符串是否是带有 javascript 的有效 URL。但我从来没有让它工作。我所做的任何事情都无法正常工作，即使这样做了，大多数链接也无法正常工作。

那么你们中的任何人都知道如何查看字符串是否为图片 URL 吗？ ;-;

感谢所有回复的人

【问题讨论】：

与我们分享一些代码
在不实际获取内容的情况下，无法查看某个随机 URL 是否是图片链接。
另外，一个有效的 URL 和一个真实的 URL 之间也有一个非常重要的区别。

标签： javascript image url

【解决方案1】：

下面是代码 sn-p 用于检查 URL 是否指向图像资源。

function checkImage (src, good, bad) {
    var img = new Image();
    img.onload = good; 
    img.onerror = bad;
    img. src = src;
}

checkImage( "http://jsfiddle.net/img/logo.png", function(){ alert(this.src + " " + "good"); }, function(){ alert("bad"); } );

checkImage( "foo.gif", function(){ alert("good"); }, function(){ alert(this.src + " " + "bad"); } );

【讨论】：

您应该考虑避免回答问得不好的问题。它不会以任何方式帮助你。

【解决方案2】：

您可以创建一个图像元素并检查 onload 方法是否为真 url 和 onerror 方法是否为错误 url。

function createImage(src, successCallback,failCallback) {
    var img=new Image();
    img.onload=successCallback;
    img.onerror=failCallback;
    img.src=src;
}

function successCallBack(){
  console.log("success")
}

function failCallBack(){
  console.log("fail")
}
const src = "https://i.picsum.photos/id/18/200/300.jpg?hmac=ey-vd9wCRyYWPf6nwCk_ciMCPRLrWvI7O5Z1Hfg2Cf0"



createImage(src, successCallBack,failCallBack);
createImage("failurlfortest.com", successCallBack,failCallBack);

【讨论】：