js怎样判断图片链接是否有效
2020-08-09 本文已影响0人
极客开发者
- 要判断图片链接是否有效,我们首先创建一个Image对象,然后把链接设置在Image对象上,如果能正常加载,则代表链接有效。因为图片是异步加载的,所以我们需要Promise来处理。创建一个处理函数,如下代码:
function checkImgExists(imgurl) {
return new Promise(function(resolve, reject) {
var ImgObj = new Image()
ImgObj.src = imgurl
ImgObj.onload = function(res) {
resolve(res)
}
ImgObj.onerror = function(err) {
reject(err)
}
})
}
- 根据以上代码,当图片加载成功时,resolve(完成)被触发,当图片加载失败时,reject(失败)被触发。于是可以使用一下代码进行调用测试:
checkImgExists('https://test.com/dssd=0.jpg').then(()=>{
//success callback
console.log('有效链接')
}).catch(()=>{
//fail callback
console.log('无效链接')
})
全部代码如下:
function checkImgExists(imgurl) {
return new Promise(function(resolve, reject) {
var ImgObj = new Image();
ImgObj.src = imgurl;
ImgObj.onload = function(res) {
resolve(res);
}
ImgObj.onerror = function(err) {
reject(err)
}
})
}
checkImgExists('https://test.com/20200803115749u=2876792700,1627849181&fm=26&gp=0.jpg').then(()=>{
//success callback
console.log('有效链接')
}).catch(()=>{
//fail callback
console.log('无效链接')
})