Remove the meta dependency from the fetch plugin.

Author: blueimp

js/load-image-fetch.js

@@ -15,9 +15,9 @@
   'use strict'
   if (typeof define === 'function' && define.amd) {
     // Register as an anonymous AMD module:
-    define(['./load-image', './load-image-meta'], factory)
+    define(['./load-image'], factory)
   } else if (typeof module === 'object' && module.exports) {
-    factory(require('./load-image'), require('./load-image-meta'))
+    factory(require('./load-image'))
   } else {
     // Browser globals:
     factory(window.loadImage)
@@ -27,49 +27,39 @@
 
   if (typeof fetch !== 'undefined' && typeof Request !== 'undefined') {
     loadImage.fetchBlob = function (url, callback, options) {
-      if (loadImage.hasMetaOption(options)) {
-        fetch(new Request(url, options))
-          .then(function (response) {
-            return response.blob()
-          })
-          .then(callback)
-          .catch(function (err) {
-            console.log(err) // eslint-disable-line no-console
-            callback()
-          })
-      } else {
-        callback()
-      }
+      fetch(new Request(url, options))
+        .then(function (response) {
+          return response.blob()
+        })
+        .then(callback)
+        .catch(function (err) {
+          callback(null, err)
+        })
     }
   } else if (
     // Check for XHR2 support:
     typeof XMLHttpRequest !== 'undefined' &&
     typeof ProgressEvent !== 'undefined'
   ) {
     loadImage.fetchBlob = function (url, callback, options) {
-      if (loadImage.hasMetaOption(options)) {
-        // eslint-disable-next-line no-param-reassign
-        options = options || {}
-        var req = new XMLHttpRequest()
-        req.open(options.method || 'GET', url)
-        if (options.headers) {
-          Object.keys(options.headers).forEach(function (key) {
-            req.setRequestHeader(key, options.headers[key])
-          })
-        }
-        req.withCredentials = options.credentials === 'include'
-        req.responseType = 'blob'
-        req.onload = function () {
-          callback(req.response)
-        }
-        req.onerror = req.onabort = req.ontimeout = function (e) {
-          console.log(e) // eslint-disable-line no-console
-          callback()
-        }
-        req.send(options.body)
-      } else {
-        callback()
+      // eslint-disable-next-line no-param-reassign
+      options = options || {}
+      var req = new XMLHttpRequest()
+      req.open(options.method || 'GET', url)
+      if (options.headers) {
+        Object.keys(options.headers).forEach(function (key) {
+          req.setRequestHeader(key, options.headers[key])
+        })
+      }
+      req.withCredentials = options.credentials === 'include'
+      req.responseType = 'blob'
+      req.onload = function () {
+        callback(req.response)
+      }
+      req.onerror = req.onabort = req.ontimeout = function (err) {
+        callback(null, err)
       }
+      req.send(options.body)
     }
   }
 })

js/load-image-meta.js

@@ -179,11 +179,6 @@
     )
   }
 
-  // Determines if meta data should be loaded automatically:
-  loadImage.hasMetaOption = function (options) {
-    return options && options.meta
-  }
-
   var originalTransform = loadImage.transform
   loadImage.transform = function (img, options, callback, file, data) {
     if (loadImage.hasMetaOption(options)) {

js/load-image.js

@@ -27,30 +27,38 @@
   function loadImage(file, callback, options) {
     var img = document.createElement('img')
     var url
+    /**
+     * Callback for the fetchBlob call.
+     *
+     * @param {Blob} blob Blob object
+     * @param {Error} err Error object
+     */
+    function fetchBlobCallback(blob, err) {
+      if (err) console.log(err) // eslint-disable-line no-console
+      if (blob && loadImage.isInstanceOf('Blob', blob)) {
+        // eslint-disable-next-line no-param-reassign
+        file = blob
+        url = loadImage.createObjectURL(file)
+      } else {
+        url = file
+        if (options && options.crossOrigin) {
+          img.crossOrigin = options.crossOrigin
+        }
+      }
+      img.src = url
+    }
     img.onerror = function (event) {
       return loadImage.onerror(img, event, file, url, callback, options)
     }
     img.onload = function (event) {
       return loadImage.onload(img, event, file, url, callback, options)
     }
     if (typeof file === 'string') {
-      loadImage.fetchBlob(
-        file,
-        function (blob) {
-          if (blob && loadImage.isInstanceOf('Blob', blob)) {
-            // eslint-disable-next-line no-param-reassign
-            file = blob
-            url = loadImage.createObjectURL(file)
-          } else {
-            url = file
-            if (options && options.crossOrigin) {
-              img.crossOrigin = options.crossOrigin
-            }
-          }
-          img.src = url
-        },
-        options
-      )
+      if (loadImage.hasMetaOption(options)) {
+        loadImage.fetchBlob(file, fetchBlobCallback, options)
+      } else {
+        fetchBlobCallback()
+      }
       return img
     } else if (
       loadImage.isInstanceOf('Blob', file) ||
@@ -92,6 +100,12 @@
     }
   }
 
+  // Determines if meta data should be loaded automatically.
+  // Requires the load image meta extension to load meta data.
+  loadImage.hasMetaOption = function (options) {
+    return options && options.meta
+  }
+
   // If the callback given to this function returns a blob, it is used as image
   // source instead of the original url and overrides the file argument used in
   // the onload and onerror event callbacks: