Image.src and revokeObjectURL

loader.setPath( directory );
	loader.load( filename+ext, function (obj) {
		if(obj.hasOwnProperty('scene')) importModel.bufferObject = obj.scene;
		else importModel.bufferObject = obj;
		
		//get all the textures that the imported model uses
		importModel.uniqueImages = [];
		importModel.bufferObject.traverse( function(child) {
			if (child instanceof THREE.Mesh) {
				try{ if(importModel.uniqueImages.indexOf(child.material.map.image.src) == -1) importModel.uniqueImages.push(child.material.map.image.src); }catch{}
			}
		});
		
		//create the textures in our format
		importModel.uniqueImages = importModel.uniqueImages.filter(e => e != null);
		if(importModel.uniqueImages.length > 0){

		     image.src = importModel.uniqueImages[0];

        }
		else importModel.convertBufferObject();
	},function (obj) {},function (error) {
		error = String(error).replace("THREE.","");
		alert(error);
	});

In order to get the image.src to successfully load, I have to comment out URL.revokeObjectURL( sourceURI ); from the GLTFLoader module…

Is there a way to get the image loading without having to edit the module like that??

the image.src looks like this: “blob:chrome-extension://enjilmhmplefekkpbciadkljojpakhmd/54d7e9a6-ba95-4024-b67c-4b040304c0d9”

I wasn’t sure how to title this post…

Seems as though I can do this:

            if(typeof child.material.map.image.src !== 'undefined'){
  				imageSrc = child.material.map.image.src;
  			}else{
  				
  				let img = child.material.map.image;
  				let canvas = document.createElement('canvas');
  				canvas.width = img.width;
  				canvas.height = img.height;
  				
  				let ctx = canvas.getContext('bitmaprenderer');
  				if(ctx) {
  					ctx.transferFromImageBitmap(img);
  				}
  				else {
  					canvas.getContext('2d').drawImage(img,0,0);
  				}
  				imageSrc = canvas.toDataURL();
  				canvas = null;
  				ctx = null;
  			}

This will allows me to get the data without having to edit the modules.