CreateJS : comment résoudre « …security restrictions on reading canvas pixel data with local or cross-domain images. »
Si vous essayez de charger des images qui ne sont pas sur le site d’origine qui demande la requête, vous allez sûrement avoir ce problème que va vous afficher le navigateur :
Uncaught An error has occurred. This is most likely due to security restrictions on reading canvas pixel data with local or cross-domain images.
Lisez la documentation très claire ici : .
Parmi toutes les solutions que vous allez trouver sur le Web, je n’en ai pas trouvé une qui fonctionne de manière simple :
- Cross-domain Ajax with Cross-Origin Resource Sharing
- Using Cross-domain images in WebGL and Chrome
- Using CORS to load WebGL textures from cross-domain images
Mon framework est optimisé pour la rapidité et la dispersion de ressources statiques sur des domaines différents.
Exemple : mon site principal est www.battlesoop.fr
mais à partir de là, toutes les ressources statiques être chargées sur des domaines différents : fr.s1.battlesoop.fr
, fr.s2.battlesoop.fr
et fr.s3.battlesoop.fr
, en prenant aussi la langue du navigateur en compte.
J’ai passé presque une journée avant de faire fonctionner cela avec CreateJS. La solution m’a été donnée sur les forums même, ici. N’hésitez pas à aller poser des questions par là-bas : c’est la première fois depuis des années que la réponse a été plus rapide sur ces forums que sur stackoverflow !
En tous les cas :
🙂