m4rk2s Posted September 20, 2017 Share Posted September 20, 2017 Hi, i have some assets (on dropbox) that i've found on the internet and i want to have them online like what did @samme on jsdeliver this way do you have any idea on how to do it preload: function() { game.load.baseURL = 'https://cdn.jsdelivr.net/gh/samme/[email protected]/'; game.load.crossOrigin = 'anonymous'; game.load.image("bar", "sprites/zelda-life.png") } Link to comment Share on other sites More sharing options...
samme Posted September 20, 2017 Share Posted September 20, 2017 If you make a GitHub repository you can use https://cdn.jsdelivr.net/gh/USERNAME/REPONAME/ Link to comment Share on other sites More sharing options...
m4rk2s Posted September 20, 2017 Author Share Posted September 20, 2017 THX @samme I've tested it but it won't work Link to comment Share on other sites More sharing options...
Tom Atom Posted November 10, 2017 Share Posted November 10, 2017 Hi, Phaser way: let imageUrl = "https://cloudgames.com/app/img/logo-horizontal.png"; this.load.crossOrigin = ""; this.load.image("LOGO", imageUrl); did not work for me too - all I got was "SecurityError: The operation is insecure.". But then I found this tutorial: https://webglfundamentals.org/webgl/lessons/webgl-cors-permission.html and this worked for me: var cache = this.cache; var img = new Image(); img.addEventListener('load', function () { console.log("***** LOADED ***** "); cache.addImage("LOGO", imageUrl, img); }); img.crossOrigin = ""; img.src = imageUrl; Now you can create your sprite like this: var logo = this.game.add.sprite(0, 0, "LOGO"); Link to comment Share on other sites More sharing options...
samme Posted November 10, 2017 Share Posted November 10, 2017 I think you need this.load.crossOrigin = 'anonymous'; An empty value ('') essentially means make no cross-origin requests. Link to comment Share on other sites More sharing options...
Tom Atom Posted November 10, 2017 Share Posted November 10, 2017 @samme thanks for answer, but are you sure? With Phaser none of "" or "anonymous" work - in both cases texture cannot be used in WebGL. That linked tutorial is using "" and it works (it also works with setting to "anonymous"). In fact, this is image I am trying to load and use: "https://cloudgames.com/app/img/logo-horizontal.png" - it is sponsor logo. It can load & use it only if used that way I described above (no matter if I set it to "" or "anonymous" , but if I omit this line: img.crossOrigin = ""; I get this error ... which is exactly what that tutorial was about (how to use CORS texture in WebGL) Now, I am struggling with http x https. If URL for image is https it works, if it is http, then it does not work. Looks like sponsors emulator is returning http, but luckily production looks to return https (I debugged one PIXI game there). Link to comment Share on other sites More sharing options...
samme Posted November 11, 2017 Share Posted November 11, 2017 When you're setting an image's crossOrigin property directly, an empty string or any string value besides use-credentials is the same as anonymous. That's why the tutorial code works. But for Phaser's Loader#crossOrigin, an empty string is the same as false, meaning don't set the crossOrigin property. The server also has to accept the cross-origin request, but I guess that's not the problem in your case. So I'm not sure why your two-step method works. It looks similar to what Phaser is doing in loadImageTag. Tom Atom 1 Link to comment Share on other sites More sharing options...
Tom Atom Posted November 11, 2017 Share Posted November 11, 2017 @samme - thanks for explanation & help! It works for me now. I tried "anonymous" before without luck, but it was messed with second problem - sever is returning URL link without protokol (like //cloudgames.com/ ....) and if I converted it into absolute URL, it added http (because my dev server is http). But server is returning image only if asked for with https. If I ask for it with correct protokol, then everything works. Link to comment Share on other sites More sharing options...
Recommended Posts