Creating Sprite from Data URI not working - cross origin issues?

[kaizoku]

In our unit tests we're trying to create a Sprite.fromImage() by passing in a data uri. This resulted in some cross origin issues so we set crossorigin to true. At this point PIXI seems to fall over and BaseTexture fails to load properly. Is this a bug or are we doing something wrong?

 

Here's an example of what we're doing:

sprite = new PIXI.Sprite.fromImage("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC41ZYUyZQAAAtJJREFUWEfNWb9rFEEYfUaFKGqnEIgJmELUIr2WFrYiIZUEkkYkpYViE8TC3kYLUwQxghiF/AmihRH8bZPgH6CnEAMRztx853s3c8sQ4rmX29ud793bmZ3b/ebd7M737c6ha2viIAxj2MIFlnNwWCZXyQ3uC474QX4gl7h/nTxLHue5g8FLH8xwDA1cZqcPWV8jt9hhPhg2ybfkA551iS2HgtcCrIl95EU6f0n+bHW4W1iL3/gjH7M8zb09oZcezHCNjtZZyn0xMF4LR6ENTIVeurQmBsgTdPQouOwfHO6yn6Os5RxNiTOcJ9+QLrjpHwx1UgMxEhT8x/zIlSOuDYl0eMpajsmjX1OmuDb8fXk/qNjBNFv9hKgWhhluB4KqyBRKNFvjg6uAY4ytYzyoCqYg7ONccaFkt1ACMNxiLco6yhC9BuEiYUyTmqwtU25V+ooPqBo+40xxu1eXd4xcC1+lA8ML8gDCU0n+xF8WfAA/qRGci5rTguEqeP8tR01pwbAogatRU1owfJLAjagpLTgmDqqsPjj/C9LGT/kPBnkhbfykk0G2w6EmgR+jprTgsCKBz6KmtOCwoFx8I2tIDYZpTZJzVPo7ak4DCjGGYY3gCCvvsi9SgWGJWz4TamOYJ+Ovq4Xin2GStfDob5jgkNayA6qG4TU56sXJDIcp8AnL6oO25oNhlrX9QV0wwxnye3ZgVXB4Tx1DQVVkWnrQtI4PrgK63TougzjcI/9kJ5QFv0R3J6joYP4VVMtj9ej0fmOdb5Y3WeZY4NTw+tj4nCxj8WizJU4TtSszHCHnI1f9gS5rT0vDhiscx68sG5nTXqFQ4mfrROilB9PLs2GcvE2nn1nGXXUHnyEUhGfJIbYUsATcNr1E6yW/gRkKfcV6/knkE79W/CfJUbZsC8JFmh9RiT1FaiQWKeAL+Yt1QX9D1MgVcoH70+Qwzxskd1hW62TAX/UEJP2Z2GhOAAAAAElFTkSuQmCC", true);

This eventually creates a new BaseTexture with our image data but we hit the onerror callback and hasLoaded and isLoading are both false.

 

There's some comments in PIXI about "An underyling source that is immediately-available bypasses loading entirely" so are we hitting this?

 

Thanks

[xerver]

https://github.com/GoodBoyDigital/pixi.js/issues/1781

[kaizoku]

https://github.com/GoodBoyDigital/pixi.js/issues/1781

 

Hi xerver

 

I'm getting the same problem despite running with updated code (I actually work with Martin!)

[xerver]

If you are using the latest (3.0.6) and are still experiencing a bug, please open an issue on Github.

 

**Edit**: Just realized you are using .fromImage and not the loader. In all cases, I recommend against not preloading things with the loader. It is much more robust.

 

That being said in base texture it just assigns the data-url to the source attribute. I don't understand what you mean by "cross origin issues", data urls are not considered cross origin so you definitely shouldn't set crossOrigin to true for a data url or it will likely fail to load properly.

 

https://github.com/GoodBoyDigital/pixi.js/blob/master/src/core/textures/BaseTexture.js#L374-L405

 

Also that comment is unrelated to data-urls, they are not immediately available and have to load.