一尘不染

角度js-isImage()-通过URL检查是否图像

angularjs

是否可以通过给定的URL检查图像是否存在并且它是图像资源?

例如:

angular.isImage('http://asd.com/asd/asd.jpg')

还是服务器端的东西?

没有JQUERY,请问我不使用它


阅读 368

收藏
2020-07-04

共1个答案

一尘不染

我认为最好的javascript方法是将HTMLImageElement对象与延迟对象一起使用:

function isImage(src) {

    var deferred = $q.defer();

    var image = new Image();
    image.onerror = function() {
        deferred.resolve(false);
    };
    image.onload = function() {
        deferred.resolve(true);
    };
    image.src = src;

    return deferred.promise;
}

用法:

isImage('http://asd.com/asd/asd.jpg').then(function(test) {
    console.log(test);
});

使用HTMLImageElement具有一些好处:不仅测试文件可下载,而且是可以通过img标记显示的有效图像资源。

我将此代码包装在简单的服务中进行测试,它似乎可以工作:

app.controller('MainCtrl', function($scope, Utils) {
    $scope.test = function() {
        Utils.isImage($scope.source).then(function(result) {
            $scope.result = result;
        });
    };
});

app.factory('Utils', function($q) {
    return {
        isImage: function(src) {
            // ... above code for isImage function
        }
    };
});

演示:http//plnkr.co/edit/u5F6FfO3dEkNSMYV1amo?p
= preview

2020-07-04