squilibob

How does setCORS work

Recommended Posts

I am trying to use an image hosted on a CDN that requires CORS . This works in Phaser 2 by setting

    game.load.crossOrigin = 'anonymous';

but in Phaser 3 I cannot get this to work. I can set crossOrigin by using .setCORS in my scene config or on the image being loaded itself but I must be using it incorrectly because I still get the (CORS header 'Access-Control-Allow-Origin' missing) error.

Share this post


Link to post
Share on other sites
On 4/14/2018 at 3:55 AM, squilibob said:

I still get the (CORS header 'Access-Control-Allow-Origin' missing) error.

That actually sounds like the CDN is ignoring or denying the cross-origin request. That seems unusual for a CDN though.

Can you open the image URL directly?

Share this post


Link to post
Share on other sites
10 hours ago, samme said:

That actually sounds like the CDN is ignoring or denying the cross-origin request. That seems unusual for a CDN though.

Can you open the image URL directly?

It works fine opening directly. https://cdn.betterttv.net/emote/55b49352120a3d66411fafd6/1x

For now I'm just using a CORS proxy but I was under the assumption that the .setCORS() function would allow me to use it in webgl/canvas. I just don't know what to set it to.

I've tried:

this.load.setCORS('anonymous')
this.load.setCORS('Anonymous')
this.load.setCORS(true)

 

Share this post


Link to post
Share on other sites

I´m getting the same problem and I´m not being able to fix it, did you find any solution to this?

 


Access to XMLHttpRequest at 'https://cdn.*********.png?v=1.0' from origin 'http://localhost' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

 

Share this post


Link to post
Share on other sites

Reviving this post because I was struggling with the same issue and found a solution. It was in fact a problem with my server and my CDN, which block CORS by default. I was using Amazon S3 and Cloudfront, and fixed the problem by following the steps on their website: https://aws.amazon.com/premiumsupport/knowledge-center/no-access-control-allow-origin-error/

Share this post


Link to post
Share on other sites

I'm getting this issue too testing with NestJS/Express, do you know how to solve that? I can't find any log debugging from back

SOLVED (using app.yaml) 🙂

runtime: nodejs10
network:
session_affinity: true
entrypoint: npm run start:prod
handlers:
  - url: /images
     static_dir: dist/public/images
     http_headers:
       Access-Control-Allow-Origin: '*'
Edited by jdnichollsc

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.